BoldGrid<\/a> offers several themes with a fixed full-page background Image. However, because all of the available BoldGrid themes are heavily customizable, you may notice a blocked background image or covered up by other page elements. If you’ve decided to delete your Call to Action<\/em> widget, you’ll notice that a large part of your background image is no longer shown. In this tutorial, we’ll walk you through the steps to modify your CSS<\/strong> so you can show your website visitors more of your background image.<\/span><\/p>\n

$\"Diced\"$ <\/a>For this example, we’re using a fresh installation of the Diced<\/em> theme. You may have noticed this theme comes with a Call to Action<\/em> widget.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

<\/div>\n\n
\n
\n
\n
$\"Blocked$ <\/a>If you delete this widget, the site content below rises up and covers the background image.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n
<\/div>\n
\n
\n
\n
\n
Follow along with the steps below to see how you can edit your theme’s CSS file to bring back your background image:<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n
<\/div>\n
\n
\n
\n
\n
Editing the CSS File<\/h2>\n
To move the elements on your page and reveal your background image, you will need to edit the theme’s stylesheet. Instead of editing this file directly, you can safely add code to it through the BoldGrid customizer.<\/p>\n
\n
$\"Click$ <\/a>While in the customizer, click Advanced<\/strong>.\n
<\/div>\n<\/li>\n
$\"Custom$ <\/a>Choose Custom JS & CSS<\/strong>.\n
<\/div>\n<\/li>\n
$\"Open$ <\/a>Under Custom Theme CSS<\/em> <\/strong>click Open Editor<\/strong>. \n
<\/div>\n<\/li>\n
$\"Add$ <\/a>Add the following code: .entry-content {margin-top: 600px;}<\/span>\n
<\/div>\n<\/li>\n<\/ol>\n
$\"Background$ <\/a>The margin-top<\/code> code adds margin space above your site content to reveal your image. We set the margin at 600 pixels of space (600px<\/code>), but you can adjust this to add more space. 800px<\/code>will give you more space and show you 800 pixels worth of your background image. You can adjust this number to meet your individual needs.<\/p>\n<\/div>\n
Fixing a Blocked Background Image<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\nThis is one specific example of how to add this code in a particular theme (Diced). The applicable code may vary depending on which them you are using.<\/strong><\/p>\n<\/div>\n<\/body><\/html>\n","protected":false},"excerpt":{"rendered":" BoldGrid offers several themes with a fixed full-page background Image. However, because all of the available BoldGrid themes are heavily customizable, you may notice a blocked background image or covered up by other page elements. If you’ve decided to delete your Call to Action widget, you’ll notice that a large part of your background image is […]<\/p>\n","protected":false},"author":9,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"bgseo_title":"Fixing a Blocked Background Image | BoldGrid Support Center","bgseo_description":"Learn how to fix a blocked background image in BoldGrid. We will show you how to accomplish this by modifying the CSS code for your website.","bgseo_robots_index":"index","bgseo_robots_follow":"follow","footnotes":""},"categories":[764],"tags":[22,29,35,36,46,61],"class_list":["post-3606","post","type-post","status-publish","format-standard","hentry","category-boldgrid-themes","tag-change-theme","tag-customizer","tag-editing","tag-elements","tag-page-editor","tag-theme"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/3606","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/comments?post=3606"}],"version-history":[{"count":28,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/3606\/revisions"}],"predecessor-version":[{"id":7955,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/3606\/revisions\/7955"}],"wp:attachment":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/media?parent=3606"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/categories?post=3606"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/tags?post=3606"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}