Rounded body wrapper shows at every corner of the blog. It covers the area of the outer wrapper of a blog designing. By default there is no rounded corners styles in Blogger Templates. These all templates looks guilty and has no professional views. It show as simple floating area in every sides of the template. But now we could easily customize it by adding splendid Css3 rounded body wrap codes inside the blogger templates. By adding such styles your blog will be turned out into professional looks and will becomes more attractive in the eyes of Visitors. Moreover it will also help in resizing your blog screen resolution according to different computers monitors.
So after receiving a lot of requests from our loyal readers finally they compel us to share the PBT rounded body corner with us. So be applying this excellent Css codes you will have get the splendider sides designing for your blog. So in our today post we will show you how to add Css3 Rounded Border Corner Wrap in Blogger Template.
So after receiving a lot of requests from our loyal readers finally they compel us to share the PBT rounded body corner with us. So be applying this excellent Css codes you will have get the splendider sides designing for your blog. So in our today post we will show you how to add Css3 Rounded Border Corner Wrap in Blogger Template.
Why to Use Rounded Border wrapper in blogger
There are alot of reasons to apply this style on your blog. i have applied the same codes only for Designing to make our blog sides layout more attractive. Some people apply this style to reduce theirs blog width with some awesome designing borders layout. Most of them use it for resizing the blog width automatically on different computers screens.
- Do,not Miss: Create Full width Page in Blogger & Remove Sidebar
You might have observed that your blog will look and generate randomly screen resolution effects if you views it by different types of PC monitors & LCD screen. So to overcome all these problem we have to add some piece of code chunk in the blogger template to have splendid rounded borders body wrap for blog. Lets do some customization to enable this features for blog.
How To Add CSS3 Rounded Border Body Corner In Blogger
You could easily customize and add some piece of code chunk in blogger template to apply rounded body style on your blog. follow the below simple steps carefully to apply this style.- Go to Blogger Dashboard:
- Got to Template >> Edit HTML:
- Now search for this ]]></b:skin> tag
- Now past the below given CSS3 Coding. before ]]></b:skin>
#pbtwrap {
background: #Ffffff;
width: 960px;
margin: 10px auto 5px auto;
padding: 0;
position: relative;
border-right: 15px solid #333;
border-left: 15px solid #333;
border-top: 10px solid #333;
border-bottom: 15px solid #333;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
box-shadow: #333 0px 1px 3px;
}
- Now once again Search for <body> tag
- Past the below given code just below the <body> Tag tag
<div id='pbtwrap'>
- Now search For </body> tag and above it paste the following HTML code.
</div>Finally You done Almost Now you save your template and refresh the page:
How Rounded Corner Body For Blogger will Look Like ?
Below are the some real example of applying the same style on your blog. You can see the best illustrative example in the below screenshots.1:
2:
Need Customization Help
Guys this Was little bit about the Rounded Body Wrap Style for Blogger blog. We have brought this tutorial by doing great effort. You could easily customize by the sides color by changing this #Ffffff;. So If are facing any problem in implementation then do not wait just post your query in the comments section and get instant result.
We hope that you all of you guys would like and love our tutorials. Guys you know that we have shared alot of tutorial based on Blogger Tips and Tricks. which were truly appreciated by newbies. Hope To get your instant feedback and your Lovely Support. Thanks Buddies do not forget to join Social community.
That's cool . Easy, Simple and handy :) Keep it up .
ReplyDeleteThanks adeel to land on css3 rounded corner body wrap for blogger, we want to stay you here all the time. We truly appreciate your words. Thanks buddy.
Deleteas usual! another nice post. Thanx for the post
ReplyDeleteThanks Sqib Bro for your lovely words and spider of PBT. Bundles of thanks.
DeleteThat really awesome. can i apply this code in Blogger simple template?
ReplyDeleteYes, you can apply it on every blogger template. It works like a charm.
Deletewww.BloggerDevelopers.com
Yes brother you can definitely apply this beautiful css3 borders effect on your blogger blog.
DeleteWonderful Trick Bro !
ReplyDeleteReally Creative One !
Regards
Rizwan Shajahan
Yup bro this such nice trick to make blog sides layouts stylishly and make them attractive. bye buddy.
DeleteThanx Hafeez It's working for me,great post.!!!
ReplyDeleteWow thanks that our post have helped you in applying css3 borders effect on your blogger blog. See you next time here.
DeleteThanks For This Trick NiCe it's LoOking Great :-)
ReplyDeletewww.locasure.blogspot.com
thanks for praising our work...See you soon.
DeleteNice Border it's look Attractive Thanks for sharing with us Hafeez bro
ReplyDeleteRegards
R.S
Yes My Dear, This is a cool and attractive borders sides layout for blogger template. if someone to have like PBT sides layout then they should easily apply this code on their blogger blog.
DeleteHafeez brother i want to ask a of topic question. i want to create subdomain. like my site w3mix.com and i creat blog.w3mix.com. is sub domain a good or bad for seo.
ReplyDeleteBro, subdomains does not effect SEO..
DeleteIt helps you to get your blog alexa rank higher.. The traffic you got on your subdomain will be calculated on your domain name..
Hope you understand.
www.BloggerDevelopers.com
Bro it will not effected SEO, but will difficult in remembering your blog name. people will not easily to remember it. thanks.
DeleteThis comment has been removed by the author.
ReplyDeleteThis comment has been removed by a blog administrator.
ReplyDeleteYour comment is removed due to insert blog url in comment body. Do not spam.
Deletethanks hamad brother.
ReplyDeleteThanks Bro,
ReplyDeleteWell Post and informative...
Keep Blogging
By Ramees from http://protrickshub.in
Thanks Too you...keep visiting us and get latest updates about blogger tricks.
DeleteThis is the cool border wrap dear. First, It beautifies the blog and also adjust the widths. Dear, I need the sharing widget which you're using at the bottom of every post. Please share it's code soon. Take Care.
ReplyDeleteWonderful CSS trick brother..
ReplyDeleteThanks your help..
ReplyDeleteVisit
www.skewline.in
Thanks good post for newbie bloggers who are looking for new modifications.I have some questions ask from you.You have good alexa rank and i think you might get good traffic too.So why did you not monetorize your blog with adsense or using any advertising method?Have you any reasons for that?
ReplyDeleteHi! I am Munna Singh before some days I was very worry with our skin surgery with any one I heared about Skin Specialist in Delhi in Klinikesthetika clinic. Then I used this service and I got a best treatment for skin. Now I am very happy to use this service.
ReplyDeleteit did not worked for me hafeez bro please help.
ReplyDeleteIs there anyway to make this border wrap be a transparent style for the color?
ReplyDeleteyes just change the value of color from any other to ffffff then it will look white color.
DeleteThese provided information was really so nice,thanks for giving that post and the more skills to develop after refer that post. Your articles really impressed for me,because of all information so nice.school branding uk
ReplyDelete