Reduce Popular Posts Size, Sidebar Spaces in Soho Blogger Themes

The Soho Blogger Theme is a fast-loading and SEO Friendly Responsive Blogger Theme, which was added as a default blogger theme a few years back.

In this post, I have written about a few essential customizations that can make this theme appear more pleasing and better looking. I have given some simple CSS Codes to remove spaces between the Sidebar Gadgets, make the Popular Post smaller, and increase font sizes on Mobile Devices.

Decrease White Space Between Sidebar Gadgets: This can be done by adding the CSS Code given below above - ]]></b:skin> or by adding it through the Blogger Customizer – Advanced – Add CSS.

.sidebar-container .widget {
margin: 0;
margin-left: 40px;
padding: 15px;
padding-left: 0;
}

I have adjusted the padding to 15px you can change it as per your requirements.

Removing Popular Posts Bylines: The Posted By, Date information will be removed by adding the CSS given below in the same manner that has been described above.

.widget.PopularPosts .byline{
display: none!important;
}

Making the Popular Posts Widget Smaller save more space: Edit Theme and find the CSS Code Below and change the 100px padding to 10 or 15 or as you wish. This will work when you do not display a Featured Image or Snippet for the Popular Posts.
 
Popular Posts Widgets in Soho Blogger Themes

.widget.Blog .post.no-featured-image,.widget.PopularPosts .post.no-featured-image{
padding:100px 65px
}

Reduce Margin in Popular Posts to save space: Edit the theme and find the CSS Code Below and change the margin to 10px or more as per your wish.
 
Popular Posts Margin in Soho Blogger Themes

.widget.PopularPosts .post{
margin-bottom:50px
}

Increase Soho Blogger Themes Text Size on Mobile Screens: See this Post Here: CSS to Increase Font Size on Mobile Screens.

Comments