How can I make this custom title in Blogger?


#1

Hey guys!

I have a blog and want to assign a new style to the titles of gadgets. Is as follows: the title, whose source is “Oswald”, have white color, while the background is of another color, filling the space which can be customized. I send a small image showing the example of the style you want:

I wonder, how can I let the sidebar of my blog with the same style of the model above.


#2

Please give the url of the blog in which you want to create headings?


#3

Nafees, this is the website link that contains this CSS style in the sidebar (http://goo.gl/8T8AIY). I wonder, how can I customize the title of the sidebar of my blog that same way.


#4

If you want your sidebar to be customized this way please send me your blog url, here or in PM


#6

Nafees, this is the link to my blog (http://goo.gl/CNj38w)


#7

Hello,This solution will work :slight_smile:

paste this css above ]]></b:skin>

.sidebar h2.title {
    background: #133783;
    color: #fff !important;
    float: left;
    padding: 3.5px;
    margin-left: 30px !important;
}

  
 
.sidebar .widget {
    border-top: 3px #133783 solid;
}

#8

Nafees, we are on track! But something went wrong, check out: (http://i.imgur.com/1gabJtj.png) One of the widgets did not stay with the same format of the previous (Facebook). What could have happened?


#9

@BrunoBezarra, add this code above ]]></b:skin> in your template:

.sidebar h2 {
    position: relative;
    left: -10px;
    font-weight: 100!important;
    font-size: 11px!important;
    padding-top: 2px!important;
}

Then, save it. Now you will get the same thing which you have shown on the picture above. :smile:

And Now, your facebook widget would appear correctly.


#10

Thank Nafees and Shivansh! The codes that you have provided were perfect! Thank you!


#11

Welcome @BrunoBezerra! Keep asking and keep learning… :smile: