{"id":120298,"date":"2020-11-05T17:14:47","date_gmt":"2020-11-05T17:14:47","guid":{"rendered":"https:\/\/blog.finxter.com\/?p=16408"},"modified":"2020-11-05T17:14:47","modified_gmt":"2020-11-05T17:14:47","slug":"how-to-increase-the-font-size-on-the-wordpress-plugin-enlighter","status":"publish","type":"post","link":"https:\/\/sickgaming.net\/blog\/2020\/11\/05\/how-to-increase-the-font-size-on-the-wordpress-plugin-enlighter\/","title":{"rendered":"How to Increase the Font Size on the WordPress Plugin Enlighter?"},"content":{"rendered":"<p>Do you use the awesome WordPress plugin &#8220;<a href=\"https:\/\/wordpress.org\/plugins\/enlighter\/\" target=\"_blank\" rel=\"noreferrer noopener\" title=\"https:\/\/wordpress.org\/plugins\/enlighter\/\">Enlighter<\/a>&#8221; to embed code in your WordPress site like this?<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">print('hello world!')<\/pre>\n<p>If you&#8217;re like me, you want to be able to customize the style (such as font size) globally&#8212;not locally for each individual code snippet. <\/p>\n<p><em><strong>Problem<\/strong>: How to increase the font size of the Enlighter WordPress plugin?<\/em><\/p>\n<p class=\"has-pale-cyan-blue-background-color has-background\"><strong>To increase the font size globally, you need to complete the following steps:<\/strong><\/p>\n<ul class=\"has-pale-cyan-blue-background-color has-background\">\n<li>Open your WordPress editor.<\/li>\n<li>Go to <code>Appearance > Customize > CSS<\/code> in your WordPress editor.<\/li>\n<li>Copy the following snippet into your CSS file: <\/li>\n<\/ul>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">.enlighter-t-bootstrap4 .enlighter span{\nfont-size: 16px;\n}<\/pre>\n<p>Note that you can change the font-size to <strong>15px<\/strong>, <strong>17px<\/strong>, or even <strong>20px<\/strong>&#8212;as you like! Also note that if you use another theme\/style for your embedded code than <code>bootstrap4<\/code>, you need to set the CSS selector accordingly. <\/p>\n<p>For example:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">.enlighter-t-wpcustom .enlighter span{\nfont-size: 20px;\n}<\/pre>\n<p>This would change the font size of all Enlighter code environments that use the custom theme. <\/p>\n<p>Here&#8217;s how this may look in practice:<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"485\" src=\"https:\/\/blog.finxter.com\/wp-content\/uploads\/2020\/11\/image-3-1024x485.png\" alt=\"Enlighter change font size WordPress blog\" class=\"wp-image-16410\" srcset=\"https:\/\/blog.finxter.com\/wp-content\/uploads\/2020\/11\/image-3.png 1024w, https:\/\/blog.finxter.com\/wp-content\/uploads\/2020\/11\/image-3-300x142.png 300w, https:\/\/blog.finxter.com\/wp-content\/uploads\/2020\/11\/image-3-768x364.png 768w, https:\/\/blog.finxter.com\/wp-content\/uploads\/2020\/11\/image-3-1536x728.png 1536w, https:\/\/blog.finxter.com\/wp-content\/uploads\/2020\/11\/image-3-150x71.png 150w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n<p>Ah, yes&#8212;if you want to learn Python, don&#8217;t forget to download our free cheat sheets: <img decoding=\"async\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/13.0.0\/72x72\/1f642.png\" alt=\"\ud83d\ude42\" class=\"wp-smiley\" style=\"height: 1em; max-height: 1em;\" \/><\/p>\n<p>The post <a href=\"https:\/\/blog.finxter.com\/how-to-increase-the-font-size-on-the-wordpress-plugin-enlighter\/\" target=\"_blank\" rel=\"noopener noreferrer\">How to Increase the Font Size on the WordPress Plugin Enlighter?<\/a> first appeared on <a href=\"https:\/\/blog.finxter.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Finxter<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Do you use the awesome WordPress plugin &#8220;Enlighter&#8221; to embed code in your WordPress site like this? print(&#8216;hello world!&#8217;) If you&#8217;re like me, you want to be able to customize the style (such as font size) globally&#8212;not locally for each individual code snippet. Problem: How to increase the font size of the Enlighter WordPress plugin? [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[857],"tags":[73,468,528],"class_list":["post-120298","post","type-post","status-publish","format-standard","hentry","category-python-tut","tag-programming","tag-python","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/posts\/120298","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/comments?post=120298"}],"version-history":[{"count":0,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/posts\/120298\/revisions"}],"wp:attachment":[{"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/media?parent=120298"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/categories?post=120298"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sickgaming.net\/blog\/wp-json\/wp\/v2\/tags?post=120298"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}