HTML / CSS Blog Website Template: Fashy
Fashy is a Blog and Portfolio HTML Theme, suited for users who want to run a professional or personal blog and wants to showcase your products, services or news with a unique looking website.
Slideshows are a unique part of the theme and were inspired by a great site for tutorials called Tympanus. You can see the original slideshow here. A big thanks to them for some piece of really great work!
The greatest feature on the home page is the recent posts / portfolio section. It will allow you to add several posts and portfolio projects to the front page in a unique way. It is designed so your visitors can see the description and images from the post on the fly without leaving the front page. Be sure to click on the posts to see this great feature in full. You can set the number of posts in the Theme’s administration.
Fashy HTML/CSS Theme Features
- 3 built in sliders (Slideshow with thumbs, simple Nivo and advanced Nivo with Thumbs)
- Unique Recent Posts / Portfolio Items widget on the front page
- CSS3 Features and Animations
- Detailed written help file
- +30 shorcodes with easy shortcode generator.
- Use your custom logo and favicon icon.
- 3 home page layouts (fullscreen & composition).
- 3 portfolio page layouts (2,3,4 columns)
- 3 Home Page Templates
- Filterable portfolio items.
HOW TO REGISTER ON OUR SUPPORT FORUMS
Support is handled via our Envato support forum. It is designed in a way so only Envato users that have bought some of our plugins or Themes can register. You have to use the purchase code in the process. This has been causing some problems so please check the screenshots below to see where to get the purchase code.
Click on the image for a larger preview!
After you click on the License Certificate you will then be able to see the code in the file which will look like in the screenshot below:
Below is a file structure for different aspects of the HTML site.
CSS is structured so you have one main file (style.css) and a second css file called for instance red.css that define the leading color and some other aspects of the Theme (hover colors, background colors, etc.). If you want to choose a different coloring scheme simply replace the current css file with new one in each HTML file.
- css (This folder holds the CSS for all of the secondary styles)
- images (This folder holds all of the images used throughout the template. Images in the files for download are simple placeholders and not the images seen in the preview.
Fashy HTML Website Template comes with several premade page templates that are listed below.
HOME PAGE TEMPLATES
- index.html (Main home page with advanced Nivo Slideshow)
- elastic-slideshow.html (Home page with Thumbs Slideshow)
- simple-nivo.html (Home page with simple Nivo Slideshow)
CONTENT PAGE TEMPLATES
- page-full-with-advance-nivo.html – (Static Page with advanced Nivo Slideshow)
- page-simple-nivo.html (Static Page with simple Nivo Slideshow)
- page-elastic-slider.html – (Static Page with Thumbs Slideshow)
- page-with-sidebar.html - (Static page with Sidebar on the left)
- portfolio.html.html - (Portfolio Page)
- contact.html – (Contact Page)
BLOG AND SINGLE POSTS PAGES
- post-demo.html - (A default single Post with content and sidebar on the left)
- single_home_port.html - (Home Page Portfolio Post)
- single_home.html - (Home Page Post)
- blog.html - (Category page)
- page_portfolio2.html – (2 column portfolio page)
- page_portfolio3.html - (3 column portfolio page)
- page_portfolio4.html - (4 column portfolio page)
GOOGLE WEB FONTS
The template uses Google Web Fonts for the title fonts. Font that is used in the preview is Oswald. Link to the font is done in HTML files in the header part:
To change the font simply replace Oswald with the font you want. You can see all the fonts that you can use in the Google Web Fonts Library.
SETTING UP THE HOME RECENT POSTS / PORTFOLIO PART
One of the leading features of our HTML template is the part below the slideshow and featured boxes. The recent posts / portfolio items section will allow your visitors to quickly check your latest news and products without leaving the home page. This widget can be found in three files: index.html, elastic-slideshow.html and simple-nivo.html. HTML files used for the presentation of the posts and portfolio items are stored in the directory home. You will find 10 premade templates there to help you out.
ADDING NEW ITEMS TO THE HOME RECENT POSTS / PORTFOLIO PART
You can add either posts or portfolio items to this section. Below is a quide how to add them.
ADDING NEW POSTS
When you are adding new items to this section please note that the name of the ID of the post that you set in index.html has to be the same as the name of the HTML file in the home directory. In case when you are adding posts use the following html code:
Since the hover effect is different whether it is a post or a portfolio items this has to be set accordingly. For posts use this HTML code:
<div id="single_home.html" class="click">
<div class="view view-tenth">
<img src="images/themeImages/image.jpg" alt="This is alt Text" />
<h3>This is a Title</h3>
ADDING NEW PORTFOLIO ITEMS
Everything is done the same apart from the -port postfix. ID of the portfolio item that you set in index.html has to be the same as the name of the HTML file in the home directory. In case when you are adding portfolio items use the following html code:
Class has to contain the port postfix and data category also equals port. Since the hover effect is different whether it is a post or a portfolio items this has to be set accordingly. For posts use this HTML code:
<div id="single_home_port.html" class="click">
<div class="view view-tenth">
<img src="images/themeImages/image.jpg" alt="Title Text" />
<h3>This is a Title</h3>
- All navigations are created by forming nested lists
- Navigations can be easily setup by copy/paste from the provided page templates
For support please visit our support portal and register as described above.
Tags: html site template, html template, html website, html/css website template