VIEW ALL GALLERY LIGHTS

Sunday, May 30, 2010

Simplex Vcard - template for minisite

Single page-minisite are light and very simple, but they have many uses. It's the best option for an professional online CV ,it can be use when your site is "under construction" . It's also use as a virtual business card , show your portfolio .
I made one Blogger template for minisites . With Blogger platform ,you don't need to worry about hosting and bandwidth ,and Javascript function is fully supported . I named it SimplexVcard .I was inspired by Vcard template in Themeforest and would like to make one in Blogger with some modifications and features . Hope you like this .

P/s: Thanks Gabriel Silveira at http://source-zone.co.cc for translating this template to PT




Live Demo | Download | | Download file and live demo in PT-BR

Here is steps to install this template :
1, Download this template
2,Open template file in a word editor like Notepad++ ,Wordpad....
3, Find this code :
<script type="text/javascript">
     $(document).ready(function(){

    $('#flickrphoto').jflickrfeed({
        limit: 8,
        qstrings: {
            id: '37304598@N02'
        },
        itemTemplate: '&lt;li&gt;&lt;a href=&quot;{{image_b}}&quot;&gt;&lt;img src=&quot;{{image_s}}&quot; alt=&quot;{{title}}&quot; /&gt;&lt;/a&gt;&lt;/li&gt;'
    });   

});

</script>

Change the Flickr Id ( where I marked in green ) to yours Flickr id . You can upload image of your projects ,your works or your artworks to Flickr and add your Flickr Id to this template ,your images will be showed in this minisite .
4,To change logo ,find this code :
#logo a {
    display:block;
    background:url(http://img199.imageshack.us/img199/3850/simplexdesign.png) no-repeat;
    text-indent:-9999px;
    height:42px;
    width: 201px;
    float:left;
    margin-left:10px;
}
and change background attribute value to your logo .The standard size for logo is 200x40px .
5, To change the information in About me section ,find the code between :
<!--about-->
<!--/About-->
and change it as you want .
6, To add more network to this minisite ,find the code between
<!--Social -->
<!-- /Social -->
And add link to your social network accounts .
7, After social network code ,you will see the code for Contact information .Add your email ,your blog ,phones ...etc

8, Save template ,and upload it to blogger . When you upload ,Blogger will ask you for keep or remove widgets ,you choose remove . Ok,you are done .
Now you have a minisite for yourself .
9, If you want ,you can change the default design of this template with your own design by modifying CSS code . For example ,if you want to change the background ,find this css code :
body {
    background: #e0e0e0 url(http://img38.imageshack.us/img38/4861/backgroundwe.jpg) repeat-x;
    margin: 0;
    font-size:100%;
    line-height:1.125em;
    font-family:'Helvetica Neue', Arial, sans-serif;
}
Change the background attribute to the background image you want .
That's all . I hope this template helpful to you .

No comments:

Post a Comment