27 February 2014

Blogger Template Experiment 5: Black & White Minimalist Simple Template

27 February 2014
Hey, we have a new template! This one's just really simple. Very toned down. You know how I love minimalist designs.

For this one you'll need to create your own header (I used this font for the demo) and add your own social media icons, as well as the search bar (instructions at the bottom of this post).

You will have to manually add your profile photo, too, if you want to do it like the demo. You just need to adjust the width of the profile pic to 255px.

This template is also customizable using the Blogger Template Designer.




Demo | Download XML File | Download HTML File

You know the drill. Back up your template first, then upload the XML or HTML file of the template above.

Add the search bar

The formatting for the search bar is already embedded in the XML file, but you will have to manually add the search bar in your layout. Go to LAYOUT, select HTML/Javascript, and then copy and paste the code below.
<div align="left">
<form action="http://YOUR BLOG URL/search/" id="searchform" method="get">
<input class="field" id="searchinput" name="q" placeholder="Search" type="text" />
<input class="submit" id="searchsubmit" name="submit" type="submit" value="Search" />
</form>
</div>
Preview and then SAVE!

Change or remove set image size

The images are set to a default size. If you want to change or remove this, go to Edit HTML and look for this code:
.post-body img {
width: 635px;
height: auto;
float: left;
}
.post table.tr-caption-container img {
width: 635px;
height: auto;
float: left;
}
You can change the width or remove the entire code. If you remove the entire code, it will just revert back to the usual options for images (original size, small, medium, large, x-large).

Preview and then SAVE!


© 2014 Color It YOU - Blog Design and Tips. Powered by Blogger.
Legal terms and disclaimers here.