Blogger Store

Created for bloggers who want to start an e-commerce or shopping site, Blogger Store is a professional looking template compatible with Paypal or Google Checkout

  • Animated shopping cart
  • Dual dropdown menu bar
  • Automatic featured content carousel
  • Grid and list style post view
Blogger store shopping blogger template

Lightroom Photo Blog Template

A beautiful photo blog template that displays photos in gallery format and is available in two styles basic and advanced

  • Switchable background
  • Attractive theme font
  • Integrated social media icons
  • Left sidebar and navigation menu
Lightroom Photo Blog Template

Magpress

Magazine style theme adapted from wordpress

  • Featured slider section
  • Dual menu bar
  • Tabbed widget
  • 4 column footer
Magpress Magazine style Blog Template

Sens

A simple theme with a clean layout

  • Full width featured slider
  • 4 column footer
  • Social widgets integrated
Sens Blogger template

Pop Out Social Bookmarking Widget

A nice-looking pop out social bookmarking widget that allows readers to share their favorite post easily

  • Neat display
  • Easy to install
Add pop out social bookmarking widget for blogger

Photografia, the Photo Blogger Template edit post

Posted by Bhavika On Friday, June 26, 2009
Photografia Blogger Template is a photographer's delight. Created by Templates Novo Blogger, Photografia would by far be the best theme I have seen on blogger for a photography blog.
photografia, the photo blogger template
This 2 column template is different then the conventional photo blog designs. It has lot more features that allows you to display your best photographs, write about it and even create your portfolio page. The home page has a mirrored menu bar consisting five boxes, which are fixed since its part of the background. Even if you don't have links to put in the five boxes, it will stay. For instance you can add page links like 'Home', 'About', 'Contact', 'Subscribe' and 'Portfolio' from Layout-Page Elements.

Below that is the slide show to exhibit your photos, you can upload images on photo-sharing sites, preferably 750x500, and click on Edit Html to place the image url. Search for this code -

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='s3slider'>
<ul id='s3sliderContent'>
<li class='s3sliderImage'>
<img src=' put url of the image here'/>
<span> text-to-be-displayed </ span>
</ li>

The single column on the left side is customisable to suit your requirements, you can add any of the blogger gadgets available. Since the home page has a fixed height it would be better to put one or two widgets in the sidebar, because the more you add it tends to look untidy.

You can also display thumbnail images which expand when clicked, so the reader clicks on a thumbnail and gets to see the larger version of the image without having to leave the current page. For this you can activate the lightbox feature, by placing the following code in your internal page.

<a href=" url of image "rel="lightbox"> <img border="0" src=" url of image" style="height: 110px; width: 110px;" /> </ a>

photografia, photo blogger templateYou can create a 'Portfolio' page and add the above code to display thumbnail images. The images appear on black background that goes perfectly well with any picture. Photografia Blogger Template would definitely be our choice when we start our photo blog.

Download Photografia, the Photo Blogger Template
Share this Blogger Template:
edit post

51 Response to "Photografia, the Photo Blogger Template"

  1. sorry but how do i edit the contents of the link lists? and the urls?

     

  2. Bhavika said,

    @ The author - hey, go to layout---page elements---then click on edit link list and make the changes you want!

     

  3. Queen said,

    why nothing appear on my front page?
    and when i click at the post label, the background is white

     

  4. thats not what i meant. uhm. for example, if i put in profile under one of those link lists. what url should i put in? do i create it myself?
    if so how do i do it?
    does the profile appear below if i have provided the correct link?

     

  5. This comment has been removed by the author.

     

  6. Bhavika said,

    @ The author - When you click on edit link list, you don't need to add title, instead put the link to say profile page under 'New Site URL' and under 'New Site Name' you can add Profile. Thats how you can add links to your pages.:)

    @ Queen - For the slideshow to work you need to add the image url in edit html, directions are provided above in the post. When you click on label the background is white, that's how the template has been designed.

    @ mémoire BY Jose - you need to add that code in your portfolio page or whtever you choose to call it, repeat the code depending on the number of images you want to add.

     

  7. ASDESIGNS said,

    Ok so i have followed the directions for the slide show and entered the URL http://www.siue.edu/~asassat/Adams/Bailie1 and http://www.siue.edu/~asassat/Adams/Bailie1.jpg in the spot that I am supposed to. Yet nothing is showing up on the blog. Just wondering if u could help pleasee!

     

  8. ASDESIGNS said,

    @bhavika hey i am trying to get the slideshow to work, but it wont. I have followed the directions and put http://www.siue.edu/~asassat/Adams/Bailie1 or http://www.siue.edu/~asassat/Adams/Bailie1.jpg in the correct place. yet it is still not working.
    Could you please help me out?

     

  9. Bhavika said,

    @ASDESIGNS - Its always advisable to host the javascript files on a site of your choice. For the slider to work, you will have to host the JS files, provided in the zip folder - s3Slider(2) and jquery(2) - and take that link and replace it in Edit html under -
    ]]></b:skin>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>

    The file names with extension 'js' needs to be replaced, then the slider should work.

     

  10. Hi, I really like the look of your template, please tell me is there any way to use in blogspot as template? how do I load the in html format?

     

  11. Bhavika said,

    @alt Stineru - Watch our video tutorial to learn how to upload a custom blogger template. You need to follow those steps to use this template as well.

    http://www.youtube.com/watch?v=jiLIH0CHVyY&feature=player_embedded

     

  12. Alright- I'm not HTML savvy at all. Just wondering, does anyone have this blog already decoded, that wouldn't mind pasting the code here so others can use it?

     

  13. Clyde said,

    @kaitlin

    the article above has the necessary code that can use, not sure what you mean by have this blog decoded :) it does not seem that complex!

     

  14. well.. i got 2 problems:

    1) my picture slide wouldnt repeat after the last picture.

    2) im very blur with the "Portfolio" page and i dont understand how to apply into the template.

    1 request: is it possible for me to change the content of the blog into black instead of white color?

    thank you in advance.

     

  15. Bhavika said,

    @ Starry Dress - Re-install the template and host the js scripts given in the template folder on a site of your choice and put the url's where indicated in Edit Html.

    For the slide:

    host scripts s3Slider (2) and jquery (2), copy the urls generated, look for the code below in Edit Html and paste the urls at the relevant places.

    <script src='URL HERE' type='text/javascript'/>
    <script src='URL HERE' type='text/javascript'/>

    For Lightbox -

    Host the Lightbox scripts, then look for the following code in Edit Html and replace the urls in the code -

    <script language='JavaScript' type='text/javascript'>
    var cssNode = document.createElement ( 'link');
    cssNode.type = 'text / css'; cssNode.rel = 'stylesheet';
    cssNode.href = 'http://url of lightbox.css';
    cssNode.media = 'screen';
    cssNode.title = 'using lightbox 2 with GPC';
    document.getElementsByTagName ( "head")
    [0]. AppendChild (cssNode);
    </ script>

    <script src=' http://url the prototype.js' type='text/javascript'/>

    <script src=' http://url of scriptaculous.js ?load=effects,builder' type='text/javascript'/>

    <script src=' http://url of lightbox.js' type='text/javascript'/>

    Follow the above steps, and the slider should work fine.

    2) For portfolio, create a post with that exact title 'Portfolio' and add the following code -

    <a href=" url of image "rel="lightbox"> <img border="0" src=" url of image" style="height: 110px; width: 110px;" /> </ a>

    You also have to create a thumbnail version of each image, 110x110.

    What content you want to change into black? the background, etc you can play around with the code in edit html...cheers

     

  16. Shum said,

    I dont have any idea how to use it..
    Can u pls tell me step by step... what to do?

    The video link doesnt work.

     

  17. Shum said,

    Is this the whole code that will go in the edit html (just replacing the url's) in ur Sepetember 27th post?

     

  18. Clyde said,

    @ Shum

    watch this video please

    http://www.bloggerblogtemplates.com/2009/01/how-to-upload-custom-blogger-template.html

    then follow the instruction in the Sept 27th post

     

  19. Pacey said,

    Hi, how do I host the Js and S3 and Lighthouse? I'm not sure how to do it.

     

  20. Bhavika said,

    @Pacey - Once you download the template folder on your desktop, you will find the javascript files in one of the folders. You can refer to the response above, on which js files you need to upload either on Google sites or windows skydrive and then copy the url and replace it in the code mentioned above...any more probs feel free to contact us!

     

  21. hi, I'm really not equipped with any html knowledge and I really want this template to work


    the thing is, I cannot find the codes that you said should be in the edit html, and henceforth, cannot replace them

    eg.
    script src='URL HERE' type='text/javascript'/

    AND

    script language='JavaScript' type='text/javascript'>
    var cssNode = document.createElement ( 'link');
    cssNode.type = 'text / css'; cssNode.rel = 'stylesheet';
    cssNode.href = 'http://url of lightbox.css';
    cssNode.media = 'screen';
    cssNode.title = 'using lightbox 2 with GPC';
    document.getElementsByTagName ( "head")
    [0]. AppendChild (cssNode);


    I want to know, are these codes INSIDE the given template html OR do we have to PUT them there?


    I understand the questions posted earlier by others, but I think for you who has the html knowledge, you cannot see what we are so confused about.

    So if a step-by-step process of how to:

    1) include a portfolio page (I know how to add links TO the portfolio page, but the thing is I do not know HOW to create the Portfolio page to link to (since it doesn't exist YET I have no url for the portfolio)

    2)put the image urls for a slideshow (and where?)

    3)activate the lightbox


    thank you so much in advance

    Please forgive me if I sound incompetent, I would really appreciate help on this =)

     

  22. Clyde said,

    @ aristarionne

    I would like you to watch the video on the how to upload a blogger template in the video guides section

    once you do that read Bhavika's comment which is approximately 5 comments before this one...please read it carefully

    once you do that and you still have a problem do not hesitate to post a comment once again...always willing to help

     

  23. Lisa said,

    It would be great to watch the video but it has been removed.

    This code that you say to replace for the slide show (in the original post) it's not in the template.

     

  24. Talin said,

    Hi Bhavika & Clyde

    I would like that when ii make clic to the Blogger Butom you can see all my posts, and not only the alst one. Or at list a few posts, but for sure not only the last.

    Which code I have to put?

    Tahnk yu very much and best regards

    Talín

     

  25. Caroline said,

    OK - I've done everything you said - I've hosted all the JS with skydrive and copied all the webaddresses of those scripts into the right bits of the HTML. I've put the link to one of my photos where I'm supposed to int he HTML - but after all that the slideshow is still NOT working :( Any ideas

     

  26. Talin said,

    Hello

    1) How can I make, that wenn I clic the Blog box aper more than one post?

    2) Which page link I have to put for the Contect box?

    Beste regards

    Talín

     

  27. Clyde said,

    @ lisa

    please read bhavika's comment posted on

    September 27, 2009 10:29 AM on this post...

    @ caroline

    have you done everything exactly how its suppose to be done, can you refer to bhavikas comment as well,,,

    @ Talin

    this template is built to display one pic on the homepage the rest of them can be seen in the gallery

     

  28. Talin said,

    Hi Clyde
    Thank you for your answer, but maybe my questions are not so clear. About the display of one pic ist for me clear, but my problems are the followings questions.

    There are a mirrored menu bar consisting five boxes, where it is possible to add page links like 'Home', 'Blog', 'Contact', 'Subscribe', ...

    1) Which ist the Link I have to add to the Blog box if I want to display more than one post.

    2) Which ist the Link I have to add to the Contact box if I want to display directly to the Outlook E-Mail.

    3) Which ist the Link I have to add to the Subscribe box if I want to display directly to the Subscribe page.

    Thank you very much

    Regards - Talín

     

  29. Clyde said,

    @ talin

    the menu bar or the navigation bar can either be accessed from your page elements or from the the edit html function in your blog

    look for the "contact" or "subscribe" and change the link to the one you like..


    please provide your blog url and i will help you better :)

     

  30. So let me know if I'm wrong, but it looks like this will work eventually. I've gotten my scripts hosted elsewhere and copied and pasted the URL paths to where they are on my own site.

    Now that I'm trying to put the Portfolio page together it seems like making any changes or additions to either the slideshow or the portfolio page will require the same extensive HTML hardcoding of the either the blog post HTML or the slideshow HTML.

    Am I wrong, or is does this have some sort of built-in automation once it's set up. (I realize I won't have to set the CSS and script URLs again, but to get the images in place seems to require copying and pasting the image locations twice per spot.) Please let me know if this is simpler than I've figure out.
    Thanks for the effort of designing and explaining it to everyone!

     

  31. Fiazio said,

    Hello, Please help me out here.
    I'm getting a tinyurl 404 image on the blog home page.
    But any of the post pages is showing the header image.
    winnla.blogspot.com

     


  32. Clyde said,

    @ Chuck Baldwin - What kind of changes you want to carry out in the Portfolio or slideshow page? I saw your blog, the slideshow isnt working, you can add more slides by repeating the code mentioned above in 'Edit Html'. The template doesnt have built in automation, you need to add each image url for Portfolio page as well.

     

  33. Clyde said,

    @ Fiazio - I visited your blog, looks like you have changed your template, if you still keen on using this one, kindly read the above comments where each step of uploading this theme has been explained.

     

  34. Thanks. I'll give it another try. I ended up going with Zenfolio.com for my primary slideshow and galleries, and keep the photoblog as the blog portion of the overall site rather than the landing page. I need something I can update extensively quickly. It's not perfect and it costs money each year but for me it's better suited for that use. Thanks again!

     

  35. 2L STUDIO said,

    Hi, i like this template a lot and i tried to install it but i cant seem to make it work. I did everything that Bhavika said in her comment, replaced all those js files with the ones i hosted on skydrive, put the links to the pictures i hosted with picassa and still the hompage is empty. Didn't get to do much cuz i got stuck in the slider. What more can i do to make it work? Please help

     

  36. hi i have placed the javascript url into the designated place but it still doesnt show up for the slider and as the main page its simply black with just my blog title. Am i missing something ? because the tabs on ur template given are not clickable also.

    http://omgbbqwtfzomg.blogspot.com/

     

  37. Hello, Please help me out here.
    I'm getting a tinyurl 404 image on the blog home page.
    i apply all of ur recomendation but slide show not working
    plz help mee
    here is my Address:
    http://pics4bruno.blogspot.com

     

  38. Bhavika said,

    @ Chuck

    :) all the best and cheers no issue

    @ 2L Studio

    please pass me your blog link

    @ husky

    have you followed bhavika's instructions on September 27th in the comments above

    @ faisal

    have you uploaded the css file and replaced the link as well...have you also uploaded all the images

     

  39. vIn said,

    http://vintographii.blogspot.com/ - my slide photo just wont appear. can u check for me? ^^

     

  40. www.pittuspics.blogspot.com pls check this and let me know if i can improve in anyway.... clyde and bhavika you both are doing an excellent job!

    but i still am not able to take out that wolfs pic at the home page :(

     

  41. im so confused. i managed to remove the wolf image. but the image i've uploaded myself appeared to be so small and right in the middle of the top. what is it that i have to do?

    and i've edited the link list. like u said put profile page under the new site url. and profile under new site name. the problem is how do i add in the contents? when i click into it, it leads to a page which doesnt exist.

    and thank you for your effort..

     

  42. Bhavika said,

    @ The author - Could you send me your blog link... PLs refer to the above answers, am sure you can fix this.

     

  43. left me using the third in my blog thank you for your kindness

     

  44. Jed said,

    How do I remove or change the wolf image?

     

  45. Clyde said,

    @ Jed

    I see you managed to figure it out!

     

  46. rwsphoto said,

    sound like a mess stuff

     

  47. YounG-H said,

    Im having troubles with the SLIDE and Lightbox... ive replaced all the urls and still not seeing anything p.s

    is this meant to be changed aswell? 'http://url of lightbox.css';

     

  48. YounG-H said,

    Nevermind the slider i got it to work... i just want to know is the portfolio page a POST or PAGE

     

  49. YounG-H said,

    Nevermind any of my previous post i got it all to work the only issue i have is how do i get the other images to show such as the loading pic and the save pic??

     

  50. Clyde said,

    @ young-h

    yes that url needs to be change

    the portfolio is a post

    you would need to get into the edit html look for those images check if they are still available at that url and if not replace em...

     

Post a Comment

    Recent Templates

    Recent Comments

    Video Guides