{"id":7173,"date":"2014-04-10T16:29:07","date_gmt":"2014-04-10T23:29:07","guid":{"rendered":"http:\/\/www.yola.com\/blog\/?p=7173"},"modified":"2014-07-15T08:28:57","modified_gmt":"2014-07-15T15:28:57","slug":"how-to-customize-your-font-properties","status":"publish","type":"post","link":"https:\/\/www.yola.com\/blog\/how-to-customize-your-font-properties\/","title":{"rendered":"How to customize your font properties"},"content":{"rendered":"<p>Last week we discussed <a title=\"Using science to choose better fonts\" href=\"https:\/\/www.yola.com\/blog\/using-science-to-choose-better-fonts\/\" target=\"_blank\">how to use science to choose better fonts<\/a>. Once you\u2019ve chosen your ideal font, you\u2019ll need to add it on your pages. Pretty simple.<\/p>\n<p><a title=\"Now Users Have Even More Customization and Design Control\" href=\"https:\/\/www.yola.com\/blog\/now-users-have-even-more-customization-and-design-control\/\" target=\"_blank\">Style Designer<\/a> and our Styles will provide your fonts with a default setting. But, you can further customize your fonts to include different weights, line heights and spacing.<\/p>\n<p><strong>Font weights<\/strong><br \/>\nIf you want to add style to one of your headers but still stay within the same font, you can leverage different weights. Depending on the font you choose, you will have weight options of light, regular, bold or extra bold. This will help you highlight different text and work great for testimonial pages like the one below:<\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" class=\"aligncenter size-full wp-image-7174\" src=\"https:\/\/blogcontent.yola.net\/blog\/wp-content\/uploads\/2014\/04\/Screen-Shot-2014-04-10-at-4.18.00-PM.png\" alt=\"Changing font weights with Yola\" width=\"600\" height=\"474\" \/><\/p>\n<p><strong>Letter spacing<\/strong><br \/>\nSpacing between letters is more important than you might think. If letters are too squished, they\u2019ll be hard to read and similarly if they are too far apart. Here are <a title=\"5 Recommended Google Web Fonts\" href=\"http:\/\/www.studiopress.com\/design\/google-font-combinations.htm\" target=\"_blank\">5 recommended Google Web Fonts<\/a> that we have in Sitebuilder that are good for reading longer blocks of content. You\u2019ll be able to adjust letter spacing in Style Designer under Fonts. Choose which <a title=\"5-minute website fixes: Using custom headers to change the tone of your site\u2019s copy\" href=\"https:\/\/www.yola.com\/blog\/5-minute-website-fixes-using-custom-headers-to-change-the-tone-of-your-sites-copy\/\" target=\"_blank\">header or paragraph text<\/a> you\u2019d like adjust and use the slider to see which letter spacing is the most appropriate.<\/p>\n<p><strong>Line Height<\/strong><br \/>\nThe height of your lines is also a key factor. This is the space between each line of text. You\u2019ll want to keep enough space so that your letters don\u2019t run into the line below, especially for \u2018p,\u2019 \u2018g,\u2019 \u2018y\u2019 and \u2018j.\u2019<\/p>\n<p><strong>Text Transform<\/strong><br \/>\nAnother great element that you can control is text transform. This property allows you to default your fonts to be capitalized, lowercase or uppercase. Depending on your brand and style, you may want to make your fonts have a text transform across each page like in the example below. We recommend using uppercase only for titles as it can be perceived as abrasive for paragraph text.<\/p>\n<p><a href=\"https:\/\/www.yola.com\/blog\/wp-content\/uploads\/2014\/04\/Screen-Shot-2014-04-10-at-4.22.59-PM.png\"><img loading=\"lazy\" class=\"aligncenter size-full wp-image-7175\" src=\"https:\/\/www.yola.com\/blog\/wp-content\/uploads\/2014\/04\/Screen-Shot-2014-04-10-at-4.22.59-PM.png\" alt=\"Changing fonts site-wide on Yola\" width=\"587\" height=\"562\" \/><\/a><\/p>\n<p>Have you played around with the font properties in Style Designer? Which are your favorites?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Last week we discussed how to use science to choose better fonts. Once you\u2019ve chosen your ideal font, you\u2019ll need to add it on your pages. Pretty simple. Style Designer and our Styles will provide your fonts with a default setting. But, you can further customize your fonts to include different weights, line heights and&hellip;&nbsp;<a href=\"https:\/\/www.yola.com\/blog\/how-to-customize-your-font-properties\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">How to customize your font properties<\/span><\/a><\/p>\n","protected":false},"author":378,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","neve_meta_reading_time":"","_themeisle_gutenberg_block_has_review":false},"categories":[130],"tags":[717,716,518,359,451],"_links":{"self":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts\/7173"}],"collection":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/users\/378"}],"replies":[{"embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/comments?post=7173"}],"version-history":[{"count":5,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts\/7173\/revisions"}],"predecessor-version":[{"id":7624,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/posts\/7173\/revisions\/7624"}],"wp:attachment":[{"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/media?parent=7173"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/categories?post=7173"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.yola.com\/blog\/wp-json\/wp\/v2\/tags?post=7173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}