Posts

Showing posts from March, 2014

5 Easy Ways to Improve the SEO of a blog & Boost Traffic

Image
5 easy ways to improve the SEO of a blog A blogger needs to know at least the basics of SEO. For this, you don't need to be an SEO expert but you need to know the minimum so that your posts are well indexed in the search engines. The phrase "Content is King" is one of the widest spread Internet memes being used by so many bloggers with the idea that you should focus on having quality content, while the rest isn't that important. This is not true. Quality content is essential, but bloggers shouldn't focus only on this matter. Besides producing quality content, your text needs to be optimized for the search engines. Boost traffic & increase SERP visibility with SEO 5 Easy Ways to Improve the SEO of a Blog Now, let's get to know the basics that any blogger needs to learn about SEO, as well as other simple SEO techniques. Below are 5 easy tips to improve the SEO of your blog: 1. Define the keyword When you write a post, it is recommended to choose the right SE...

What is the difference between padding and margins?

Image
For those who would like to know more about HTML and CSS, in this post we will learn the differences between margin and padding CSS properties that are used to add space between the HTML elements, thus preventing the elements from getting 'stuck' together. Although both have similar functions, each work in a different way. Padding determines the inner margins, being used for changing the distance between the content of a given element and its border. Margin is the space outside of an element affecting how far the element is away from other elements. For a better understanding of how the padding and margin work, take a look at the picture below: Difference between margin and padding Just as you have the option to define the borders for each side of your HTML elements (eg. borders for the sidebar), you can do the same with the margin and padding properties . All you need to to do is to change the top, right, bottom and left values??. The values that you can use include: pixels...

Add a Custom jQuery Lightbox To Blogger

Image
If you are not satisfied with the default Lightbox set up by Blogger, here's another cool way to show off your pictures. In case you missed it, I have already shown in one of my posts how to customize the Blogger Lightbox by changing the background color, borders or the text color. This tutorial will show you how to replace it entirely with a cool jQuery Lightbox plugin that is very popular among bloggers. What this Lightbox does is to display a larger versions of the images that will pop-up into a larger box once we click on them, and allows us to easily navigate through that set of photos by using the previous and next buttons. To see how it works, visit the demo blog and click on any picture to enlarge it. Demo Blog Adding jQuery Lightbox to Blogger Step 1. From your Blogger Dashboard , click on "Theme" > "Edit HTML". Step 2. Click anywhere on the code area and press the CTRL + F keys to open the search box, then paste the following tag inside the search ...

How to Use Cookies in Javascript

Image
Each time we visit a website, cookies can be stored to 'remember' things that we do while browsing a page. This may happen, for example, when we visit a page where we have to login with an username and a password. In this case, after verifying that the login is correct, usually a cookie is stored on our computer. An example would be the popular page of Google. This search engine allows users to choose how many search results they want to see on each page. Thanks to a cookie, this configuration remains unchanged for each computer, even after rebooting several sessions. Despite this, it is good to remove them from time to time because although some will expire being erased automatically after a while, some of them will never do so. Like many other things, cookies may suffer a poor use and hence, their bad reputation. For instance, some websites can store and study the browsing habits of a user without their knowledge. This is why most browsers already include a system to filter t...

How to Add CSS code To Blogger using Template Designer

Image
If you are having difficulties adding the CSS codes in a Blogger template, here's a short guide that will show you a more practical and fast way to add CSS (Cascading Style Sheets) so that it will be easier for you to customize your blog. Some users have complained that when they had to add the CSS codes to install some feature in Blogger, they found it difficult to locate the ]]></b:skin> tag. So, I decided to make this quick tutorial to show you another way of adding the CSS without having to access the Blogger HTML editor. Adding CSS via the Blogger Template Designer Step 1. Log in to your Blogger account and select the blog that you want to customize. Step 2. From the Blogger dashboard, choose "Template" and click on the "Customize" button. Step 3. Click on the "Advanced" tab. Step 4. Now just add your CSS code inside the "Add CSS" tab (if you have more options, you may need to scroll down the list). Here you can add any CSS co...

How to add custom Variable definitions to Blogger

Image
In this tutorial, we are going learn about the CSS Variable Definitions for Colors and Fonts that could be found at the top of the style sheet of a Blogger blog. The values for the Variable definitions can be modified directly through the Blogger Template Designer where are the settings for colors, backgrounds, fonts and font sizes. Most default Blogger templates, such as the Minima Template, use these settings for the CSS, which makes it easier to modify the variables through the Blogger dashboard, using the Template Designer ("Template" > "Customize") editor and going to the "Advanced" section. If the definitions are already added in the CSS, we'll be able to change the background colors, font colors, styles or sizes, directly from our Blogger dashboard without having to touch the HTML code of our template. If these values ??are not set, we can define them by creating our own variables. The more variables are created, the greater will be the eas...

Understanding the Page Elements of a Blogger Layout

Image
When following a tutorial on how to add a gadget/widget or make some customizations in a Blogger blog, some new users may not know the meaning of certain terms, and it may be harder to locate them. As for the gadgets, usually it is required to access the blog's layout in order to add or arrange any of the page elements. For a better understanding, here are some basic explanations about the Page Elements located in the Layout section of a Blogger dashboard . What are the Page Elements? Page Elements is, basically, the body of our blog. To access the Page Elements, we need to click on the " Layout " option in the Blogger dashboard . Understanding the Page Elements sections The Blogger Layout is made of sections and elements . The sections mark certain areas of a page . Every section is represented by the <b:section> tag and has an unique "ID" that names its element which is followed by a CSS " class " selector. Each section has some attributes ...