Audrino

The Christmas countdown has begun and while homes are decorated with colorful lights and the sweet smell of pine trees, there's no reason why we wouldn't decorate our Blogspot blog with Christmas bells next to the Popular Posts widget for Blogger ! So, today I was playing around a bit with CSS and I was thinking that it would be cool to add some fresh styles to the Popular Posts widget in such a way to look just ready for the forthcoming Christmas holiday. To see a demo for the Popular Posts widget for Christmas, please visit the demo blog: Demo blog How to Add Popular Posts Widget with Christmas Bells in Blogger Step 1. Log in to your Blogger Dashboard, then go to 'Template' and click the 'Edit HTML' button: Step 2. Click anywhere inside the code area and press the CTRL + F keys, then search for this tag: </head> Step 3. Just above the </head> tag, add the following CSS code: <style> #PopularPosts1 .item-thumbnail:before{ display: block; conte...

Sometimes, when using scripts, we must write special characters like accents by using a special set of codes called character entities. However, these don't always look good or we get a question mark or other strange symbols. Usually, this is solved if the character encoding is done right but the logic may not always work. In Blogger, special characters most of the time appear correctly, but when it is about other services, like external files, things can get complicated. For example, this usually looks good and when you click on this link , you should see the letters in the right way: alert(" � � � � �  ? ? ? "); If we are trying to use other method and we want to use this type of characters, sometimes we need to write them in a special format called escape sequence which is nothing but a backslash followed by a letter and a number in hexadecimal format. In the case of common characters or accents, it would be \x followed by two hex digits: \x e1 is the letter � \x e9 i...

One of the limitations of a blog is that it doesn't have an index or sitemap of the site to make it easier for readers to find the content that they are searching for. While the blog archive and labels have all the information about the published post, these do not appear on a single page completely, so searching for more posts is not always easy. Luckily, this gadget will help you to add a table of contents or sitemap on Blogger showing the index of all posts separated by categories that have been published. It will also show the latest posts with a text saying New! Demo: You can see it in action by clicking here . How To Add a Sitemap with a List of Posts to Blogger To implement it on your blog, follow the steps below: Step 1. Login to your Blogger Dashboard and select your blog Step 2. Go to "Pages" > click the "New Page" button. Step 3. Click on the HTML tab and paste the following code inside the empty box: <style> p.labels a{color: #242424 ; te...

This is a simple and easy-to-use jQuery plugin which enables drag and drop functionality to make your site more interactive so that readers can "play" with certain elements on the page by dragging them from one side to another. For example, they can drag the images with a script to move them on any part of the blog just with a mouse click. Drag and Drop Elements or Images on click with jQuery & EasyDrag To see how this works, please visit the demo blog and click on any item, then move it anywhere on the screen: Demo blog Adding EasyDrag & jQuery to Move Elements or Images in Blogger 1. Login to your Blogger account, go to 'Template' and click the 'Edit HTML' button: 2. Click anywhere inside the template's code and press the CTRL + F keys to search for this tag: </head> 3. Just before </head> paste the following scripts: <script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/> <script type=...

The results of daily visits in the web hit counters always have a margin of error. In most of them, this margin is very high, therefore the statistics shown are not even a bit closer to the actual visits we have. Google Analytics has a very short margin of error, which makes it more reliable, so that we have a better idea of how many people visit us. However, if you visit your own website, either to check if everything works well, to review comments, to answer them, to see if anyone is online, or just because you need to enter, then your visit will also be registered in the counter. This implies that the margin of error is larger again, because those visits are not our actual visits and we are not interested in knowing how many times we are coming back to our site, but how many people from elsewhere are visiting. Therefore what we can do is to filter our IP so that we won't be registered in the statistics and thus to get "cleaner" results on the total number of visits and...

Today we�re going to go over a super simple CSS technique that you can use to make it snow on your Blogger blog. It seems particularly attractive since it doesn't require scripts, only CSS and three small images. An advantage of this method is that by not using scripts doesn't overload the blog, the disadvantage being that users with not so modern browsers, will not be able to see it (in Internet Explorer works for version 10 and up). The snow will fall in the background of the blog, which, in addition, prevent interfering with links or content (because the flakes are images), also prevent blocking the visibility of the content of the blog. DEMO How To Add Falling Snow To Blogger Blogspot Step 1. Go to "Template" and click on the "Edit HTML" button: Step 2. Click the small arrow on the left of <b:skin>...</b:skin> to expand the style (screenshot 1) and click anywhere inside the code area to search by using the CTRL + F keys for the ]]></b:s...