Pages
Saturday, 25 October 2014
Thursday, 23 October 2014
Wednesday, 22 October 2014
Take for blogspot or wordpress blog interesting Metro style four types of Alert Box!
Today just is not blogspot, blogspot and wordpress, both came up with any blog platform for creating Metro-style dive Alert Box. Among the many blog posts you're getting to see different notices Alert Box. Thats Alert Box blog is called. No information about the post can use this box to show the highlights. Today I share with you four of four different types of design Alert Box respectively Error Message Box, Success Message Box, Warning Message Box and Information Alert Box. Alert Box Demo Link.
How to Add Alert Box to blog?
If you are a user of blogspot blogs blogspot Dashboard Template> Edit HTML option from the template codes]]> </ b: skin> find the code and found this piece of code in the code given below the embed codes.
ooeyasinoo - Double-click on the code to copy the code
.info, .success, .warning, .error {
background-repeat: no-repeat;
background-position: 10px center;
border: 1px solid;
margin: 10px 0;
padding: 14px 9px 14px 48px;
}
.info {
color: # 0D81E9;
background-color: # C8E9F8;
background-image: url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXMM0vEkuWrJtYtZw3ntzCbHKmXv_zvAirp1byXM3hYKnTNoO4R8RghuY5UKh6pM_WJPlMbgM8mhSv4sHxJl6C4FjWMOhP16Cmd8O0jvJFo9PilxIfmWdjXg8VxQkwW33VG2g7X2h7Ino/s1600/tbm_info.png);
}
.success {
color: # 0D8F07;
background-color: # E5FAC3;
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhObsElsMC6knqTBtMibdd2FIOb_PZ8RxM39MeEf9ZHOj7snO2XebOAPwZu8FHDvT4EjhC0KAq55Yajfvsl2e8boBAtMRIZn9YbulqPft1dJR5P6Ps_EZJMtBTicR3IPowntZAB6H4qvf0/s1600/tbm_success.png);
}
.warning {
color: # DD8500;
background-color: # EBDCA3;
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinQHid_V1JPQhAZsuCu4aV0-FTfXiZil3JzqfKnZz91ybn59CB4jyHqasQb5NpBGWCHUYfEX2kRuWeLpjcyqtfjlh9iLKt1UFQkxdzzzWBDfuSp-mPwKdcKrE_gdtBGcnNHHsK0bCKk9c/s1600/tbm_warning.png);
}
.error {
color: # DF000C;
background-color: # F5C8C8;
background-image: url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikN3uOivtdMspWlgCWin0R5lEOW29AUmIyX0M91QTWWalS16qpruMAR28zMKse1FawjwyPGfZQsU74E8KOZCjJASphvDj2k5OKE3xG2O10pqgkk1ACzYtpvDUnBQ6NrzTsD9pAqJ5bsQ8/s1600/tbm_error.png);
}
To Save the template.
This was the initial work for your blogspot blog. So take a little rest. Step needed to teach them to give WordPress users.
Hmm, I go and WordPress platforms. Who made WordPress blog and they want to add to this box blog wordpress dashboard Appearance> Editor> style.css style.css are given the option to go and add to the top of the CSS codes.
Although ekatuku Expert WordPress users. So I do not explain them in detail. But he still does not understand the format.
Alert Box will also use the blog post?
We have already done preliminary to add blog've Alert Box. Now just to show you how to use the Alert Box post.
<div> Error message </ div>
Notice the code above. I'm here from the middle of the four-style Error Message Alert Box Style box code've mentioned. If you are in any of the posts you want to put this Error Message Style box, and then put the code above in the Message Error message to the places you want to write them. Thus, the style of the rest of the message box to use substitutions. I'm referring to the style of the text boxes below code.
<div> Info message </ div>
<div> Successful operation message </ div>
<div> Warning message </ div>
<div> Error message </ div>
But remember one thing, post codes at the time of this post blagaspate note in the HTML Mode Text Mode in the note and WordPress. But y'know tell. And dont forget that if you have some understanding.
. Thanks
Subscribe to:
Posts (Atom)