Main menu

Pages

Reshape popular Blogger blog posts with some professional colors.

 Reshape popular Blogger blog posts with some professional colors.


Popular Blogger blog posts are essential additions to increase subscriber mobility and these posts are the image and title of a topic that has previously been posted on the blog and whenever these topics appear in posts it indicates that they are the most viewed and visited on a site with more interactions Knowing that popular posts help in ranking topics in search engines because people go to them and extend the session, and this process is the most important thing you should focus on in a blog.



Today's topic will be about adding a tool to the Blogger blog to help change the colors of popular posts or migrate suggested topics, and of course this addition is added inside HTML without increasing or decreasing instead of CSS, and at the same time, we don't know if this works in all blogs, or only in some blogs or let's say so in some templates



Change the format of popular Blogger blog posts to some professional colors.



Today in the Blogger Tutorials section we are going to offer you one of the best plugin that gives a professional look to popular blog posts for free, and this plugin that we will share with you is added to the CSS that gives commands for popular posts to change the default color for different colors that often exceed 5 colors (yellow, red, green, orange, blue, cyan...).



Many professional or beginner bloggers are always looking professionally for the right format for a blog without causing Blogger Blog errors. That's why you always find in many blogs you visit that there are some add-ons that draw you to them and search for similar ones.



In fact, I personally do not like to add a large number of add-ons because I want the site to be classic in one color and clear add-ons as clear in your hands, that you should know that the more you remove add-ons, the faster and the site becomes lighter, especially on smartphones that Google has come to rely on. A lot, but different people's tastes are different, so we'll share with you re-formatting regular Blogger blog posts into a few professional colors and to match almost most templates.




In this humble blog, we will offer you an add-on that posts posts professionally in different colors, consisting of (yellow, red, green, orange, blue, cyan ...), of course, if you are looking to change the overall post with many professional colors, what you need to do if you don't follow this simple explanation that only requires you to take one step, and as a note in this CSS code that helps give a professional look to popular posts, I won't put this in known places like ] ]></b:skin> or when adding a tool inside a coordination




How to change a popular post into a few professional colors:



First we will open the blogger's blog >> then I will go into appearance >> you will find the setting, click on it >> then enter the HTML modification and then we will look for this command <b:template-skin> it will be like this picture.



We'll click on it and open it, then we'll place the  code above it so it's in the middle like in the image.



Copy the general zip code:



/* Popular Post keren warna-warni */ .PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{list-style:none;border:none;background:none;outline: No; fields: 0; padding: 0}.PopularPosts ul {list style: none; font size: 15px; color: #fff; fields: 0! important; width: 100%! important; font-weight: bold} 0,0,0 ,0.2)}.PopularPosts ul li img:hover{border:4px solid rgba(0,0,0,0.5);transition:all 400ms easy-in-out}.PopularPosts ul li{background-color :#eee;counter -increment:num;position:relative;margin:0 10% 0 0;padding:10px;height:70px;}.PopularPosts .item-title{text overflow: ellipsis;overflow:hidden;height:64px }.PopularPosts ul li:before,.PopularPosts ul li .item-title a{font-size:15px !important;color:inherit;text decoration:none}.PopularPosts ul li:before{content:counter(num);display: block; position: absolute; font-size: 35px !important;font-weight:700;color:rgba(0,0,0,0.2);top:40%;left:9px;} .PopularPosts ul li{margin:0 !important;padding:10px 5px 10px 40px} .PopularPosts ul li:nth-child(1){background color:#5d93b2}.PopularPosts ul li:nth-child(2){background color:#67b8b3}.PopularPosts ul li:nth-child(3 ){ background-color:#67c27a}.PopularPosts ul li:nth-child(4){background-color:#ee9f7e}.PopularPosts ul li:nth-child(5){background-color:#ea6868}.PopularPosts ul li: nth-child(6){background color:#b65757}.PopularPosts ul li:nth-child(7){background color:#e9c462}.PopularPosts ul li:nth-child(8){background color:# 84d558 }.PopularPosts ul li:nth-child(9){background color:#4dd38c}.PopularPosts ul li:nth-child(10){background color:#b44d7a}



You have also noticed that the process of changing the post color for the blogger template is very easy and does not require you to be a pro, but as we told you, not everyone likes to have a blog with flowers, decorations, and other shapes, so I personally prefer it to be default blogger blog.

Comments