Anyone who has downloaded the Blogging Pro template (the template used for this blog) from eBlog Templates will have noticed one slight display problem.
The template is supplied with a built in AdSense location in the header. If you choose not to use AdSense ads or if your reader is using an ad blocker then the ad space collapses and the top of the right column covers most of the RSS subscription buttons. You may also have noticed this if you use an external blog editor such as Windows Live Writer to write and preview your post.
This looks untidy and very unprofessional. It may even stop anyone who is visiting your blog for the first time from going any further.
Fortunately the solution is simple. All you need to do is add a minimum height to the CSS for the “Syndicate” div which contains the AdSense code.
Search for “Syndicate” in the CSS and you will find:
.SyndicateBG{float:left; width:100%}
.Syndicate{border-bottom:1px solid #717B87; border-top:1px solid #717B87; clear:left; margin:0pt auto; position:relative; width:900px; padding:20px 0px}
It is the line beginning “.Syndicate” to which you add the following code:
; min-height:90px
I have highlighted the added code. The final CSS will look like this:
.SyndicateBG{float:left; width:100%}
.Syndicate{border-bottom:1px solid #717B87; border-top:1px solid #717B87; clear:left; margin:0pt auto; position:relative; width:900px; padding:20px 0px; min-height:90px}
If you have chosen not to use AdSense then what you put in this space is up to you. As for your visitors with ad blockers in place, you will at least present them with a professional welcome instead of a collapsed header section.
I hope that this has been useful.
Subscribe to comments for this post (RSS)
0 comments
Post a Comment