How to install a Blog Kit on your Site

Your blog needs a makeover  but you aren’t a programmer or photoshop / illustrator specialist, so you buy a web/blog kit .  But… when you get what you bought, you are disappointed because there are only png and jpg and you have no idea how to use them. Nothing wrong with the kit, believe me ! This is what a web / blog kit is , a collection of web graphics that you can upload to your website.

 

HOW TO ADD BLOG KIT ELEMENTS

You can upload your web graphics with HTML or an Image Widget.

If you’re just adding simple images, such as your profile pic or buttons, and you want an easier way, you can add an Image Widget and upload your image that way. Then you don’t have to deal with HTML at all.  You can add as many Image Widgets as you like, but they may end up more spaced out than you’d like them to be , and HTML is the only way you’re able to add social media icons next to each other.

 

1.IMAGE WIDGET :

Now with the new gutenberg wordpress you can add Image Widget through posts , pages and basically everywhere. Pretty cool, right? You can change the photo size, alignment or add a link to (for buttons, call to actions).

2.HTML :

Whatever you add a HTML Widget in a widget area or just write a post or a page in text mode, the code is the same.

Code for images like signature at the end of posts, dividers, sidebar tabs and so on is :

 

<img src=”image url  alt=”give a name to your photo  style=”width:100%or50px;  height=auto;  margin:10px; padding:10px; text-align:center/right/left; />

 

The style attribute (underline text ) is optional but is important if you want to make changes like :

size , you can give a size in percent(how many percent of the image you want to be displayed) or pixel  (how many pixels do you want the image to have)

margin ; you can add a positive or o negative value for margins,

if is the same margin for top, right,bottom,left just add margin:10px(value in pixeli), but if you want a margin only on top add margin-top:10px;  the others are margin-left, margin-bottom, margin-right .

padding , only positive value in pixels and is the same story with margins , padding-top, padding-right, padding-bottom, padding-left.

text-align , where you want your image to be placed

 

 

and for image with link like buttons, call to actions (get in touch, find about, visit my shop, read my blog etc…), logo , social media icons , catogory icons

 

<a href=”url where you want the user go when click on image“> <img src=”image url   alt=”give a name to your photo style=”width:100%or50px; height=auto; margin:10px;  padding:10px; text-align:center/right/left; /> </a>

The code for the image is the same, except that you get your image wrap in a link.
If you want a more in depth understanding of HTML, read the article Basic HTML codes for Bloggers .

 

WHERE TO ADD BLOG KIT ELEMENTS

1.Logo

If the package includes a logo add it to header (Customise >> Site Identity),  and Footer with an Image Widget and a link for Homepage.

 

2.Homepage

Make your blog’s design like a #girlboss! with some fancy call to action buttons and category icons.branding set + web kit

3.Side bar

The side bar of your blog is prime real estate when it comes to capturing your reader’s attention. No matter what post they’re reading or what post they’ve landed on, they’re always going to see the side bar content as well, so if you really want them to click on something, it should be right there waiting.

branding set + web kit

4.Footer

Make your footer work for you with your logo,or your signature and some icons to match your brand for social media & categories.

 

5.Content

Give your content a profesional look inserting dividers , page headers and signature. You don’t even need to write code because with wordpress editor you can add media.

WHERE TO FIND FANCY BLOG/WEB KITS

I have a beautiful collection of the most fancy blog/web kits from all the sites so you don’t have to scroll over thousand of products and waste a lot of time. Time means money ????

how-to-install-a-blog-kit

Anyway, if you feel like this is to much for you but you really want a beautiful makeover for your blog, I can install the kit for you, just get a quote.

 

 

♥ THIS POST ? SHARE IT WITH YOUR FOLLOWERS →

 
How to install a Blog Kit

from the same category

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Share
Tweet
Pin