Introducing our new photoblog theme!
Recently, I had been getting into photography again, and thought I’d start up my own photoblog. I thought I’d use Wordpress and was looking around at a couple of photoblog themes, but many of them required the creation of multiple images, usage of custom fields, etc. I really didn’t want to have to do all of that for every photo though. I just wanted to upload one photo, write a description, slap on some tags, and be done with it.
After a bit more searching, I found a wonderful plugin called “Yet Another Photoblog” plugin that managed to do a lot of the heavy lifting (thumbnail creation, image caching, etc), complete with it’s own functions for creating photoblog templates. So I thought I’d create my own YAPB plugin based theme, so:
Now introducing, Phloggin‘!
Features
- Upload a photo and let the “Yet Another Photoblog” plugin do the heavy lifting of resizing the images for you!
- Images are cached for faster load times and less strain on your server
- Widget sidebars on the right side on the index page, archive / search pages, and in the bottom footer
- Easy navigation through pictures instead of just post titles
Installing the Theme
Installation of the “Phloggin’” theme is the same as any other Wordpress theme except that it requires the “Yet Another Photoblog” plugin to work.
This plugin not only adds an extremely quick and easy picture upload bar to the Wordpress administration panel, but it will also do the boring work of resizing your images for you. This will give you the ability to easily upload any image straight from your computer without having make multiple sizes of the same image for each post.
This theme includes the 1.9.18 of the plugin, but it can also be downloaded from the official Wordpress Plugin Directory here: http://wordpress.org/extend/plugins/yet-another-photoblog/
Directions to install “Yet Another Photoblog” plugin
From WordPress 2.7 on, you may do that directly via the WordPress Admin Interface:
- Just go to Plugins/Add New
- Enter the term “YAPB” and start the search
- Click on “Yet Another Photoblog”
- Click on “install”
On WP 2.6.5 and below, you have to do that manually:
- Unzip the content of the zip-file into an empty directory
- On your server, create a directory “yet-another-photoblog” below your “wp-content/plugins” folder
- Upload the unzipped files directly into the new folder
After everything is installed,
- Go to “admin panel/plugins” and activate YAPB
- Under Settings, go to the YAPB Options Panel, then click “Automatic Image Insertion”. Disable “Activate automatic image rendering in general.”
- Finish!
After you’ve activated the plugin, you’re all set to install Phloggin’! Just unzip the Phloggin’ theme into your
wp-content/themes/ folder and activate it in the administration panel under the Appearance tab!
How to use
The Yet Another Photoblog plugin creates a nice easy, accessible photo image upload field right above the content of every post in the Wordpress admin. Just upload your photo there, and the theme will take care of the resizing and placement for you.
The theme is a fixed width of 960 pixels, so I would suggest uploading images that size or larger for the full effect. Smaller images are ok, but do not make as strong of an impression in my opinion.
Once small thing I discovered while creating this theme was that apparently the default settings for a PHP install is to refuse uploads more than 2 MB. If you do want to upload larger files, and have access to your server, the easiest solution is to create a .htaccess file in your wordpress base directory and add this line:
php_value upload_max_filesize 10M
This would allow file uploads up to 10MB in size. Just replace the “10M” with whatever size you need.
Also, the right side of the index page, archive and search pages, and the bottom footer have been wigitized, and should be able to fit most standard widgets without any trouble.
Limitations
Feel free to use this code however you please. All we ask is that you please support us by leaving our link in the footer. So go out there and get photobloggin’ already!
If there are any suggestions, bugs, etc, please feel free to email or post in the comments below. I hope you enjoy the theme!
This entry is filed under work and tagged with programming, themes, web development, wordpress.
You can also follow any responses to this entry through the RSS 2.0 feed.
Or perhaps you're just looking for the trackback and/or the permalink.
Finally a theme for YAPB which works with current wordpress. Thanks
One thing though, in the navigation menu, when I click I get nowhere. Not to
* Tags
* Categories
* Latest
* Archive
That functionality doesn’t seem to work, unless there is some setup I need to do.
I took a look at your page, and I think what is happening is that because you had both the jQuery and Prototype javascript libraries loading on the same page, they were conflicting with each other.
I updated Phloggin’ to get rid of the conflict, so try downloading and re-installing it one more time. I have a feeling it will work this time. Thanks!
Marvellous! It works like it should now. Thank you!
Cool Javascript on latest images!
One more thing. I’ve created a Mosaic page based on a template provided by the author of YAPB. It works, in that it gets the images, however the styling isn’t good. As you can see from my Mosaic page it just outputs a list of images in a vertical order.
Can you tell me how it can be styled like a proper Mosaic page? I think it would be very nice to have included in the theme. The template gets the latest 1.000 images.
Thanks!
If you apply a “float:left” to each of the li tags in your unordered list, they should line up horizontally for you. Then, with some margin or padding, you can space them out as you need.
I’ll look into making a mosaic page for the theme. I think that could be a really interesting and quick way to display all the photos at once, and maybe save a step of having to go through the archives page.
That worked, thanks! Now it looks like a Mosaic page. But I’m sure you can make it look better
Iskwew, might I suggest something?
On your mosaic pages template, give that UL an id of say, ‘mosaic’.
Then in your styles.css file, you can create the following:
#mosaic li {
float: left;
list-style-type: none;
margin: 0px 10px 10px 0px;
padding: 0px;
height: 125px;
width: 125px;
overflow: hidden;
}
In this manner, you’d be able to force a consistent shape/size to your thumbnails, and not have the jagged-right result.
In addition, you wouldn’t have to hand-code (seems that way anyway) each and every you create on that mosaic page- the css would create the float:left for you.
Didn’t mean to but in, but that sort of struck a speed bump for my eye as everything else was fairly well in a ‘grid’
I’m also not sure until I hit ’submit’ whether or not this commenting system allows for inline coding, even if it is “safe” CSS.
Here goes…
I finally got around to checking your suggestion out, and you’re right, it does look better
Thanks!
Can you tell me where exactly do I have to do this. Im also experimenting with a mosaic page and have the same vertical list problem.
I don’t know where to put the float:left. And what/where is the unordered list?
Thanks for the theme ! I’ve tried several and finally one that works…
That said, I’m having problems with building a mosaic page…
I’ve added
style=”float:left”
to the php list element code. It no longer is vertical, but now on a diagonal.
I’m nearly clueless on html and php.
You mentioned margin/padding I’m not sure what you are getting at.
Thanks again
Phloggin’ is truly awesome. Thanks so much for creating and supporting it; it came in just in time as I decided to start using WordPress for my company’s website.
There is an error on the archive page. No matter what month you click, you get to the same heading. In my case August 2006. You have the error on you demo-page as well. If you click May 2009, you get to March 2008. It gets the right images, but the heading doesn’t change.
Fixed, thanks! I’ve updated the theme files as well. Let me know if you run into anymore problems.
Thanks!
One more thing; I was writing my about page last night, and noticed that when aligning the image right, it would not allow the text to float around the image, but creates a big, blank space. You can see it here.
If you want me to report bugs on e-mail rather than here, feel free to drop me an e-mail
I’m still having problems with this same issue, even after downloading the most recent theme. Any idea what’s causing it?
beautiful theme… I try it :$ but I have some problem with image… “Thumbnail generation unsuccessful”
I don’t know what is the problem.. =/
Great theme! Is there a way to make it so anyone can sign up and post their own images as well? Make is sort of a family site?
Is there any way to make the titles of each blog post smaller? They tend to cover a significant portion of my photo.
After I have downloaded and extracted both the theme and plugin: I install the plug in and activate it (no problem), then I install the theme, it shows in the dashboard correctly, however when I activate it I get the following: ‘New theme activated. This theme supports widgets, please visit the widgets settings page to configure them.’ Next I click on the visit site button and the following message is displayed: ‘Parse error: parse error in C:\wamp\www\sites\wordpress\wp-content\themes\phloggin\index.php on line 104′ Now there is no line 104 in the index.php. Am I missing a step during the install? Perhaps something to do with the widgets referenced earlier? Any help would be appreciated, It’s a great looking theme by the way. Thank you for any help you can afford.
Hey Cat! I got the same problem you did. With a little playing around I discovered that the problem was in the files. When opening a PHP section of code, instead of using the pages are written using instead. If your server doesn’t support that kind of shorthand coding like mine, you might want to make a search & replace for the “<? ” string and replace it with “<?php “. You go ahead and do that and your problem should be solved! Happy blogging
Sorry some of my comment got cut out. Here is my fourth sentence without the missing words… When opening a PHP section of code, instead of using “” the pages are written using “” instead.
Wow! Here is me trying again:
When opening a PHP section of code, instead of using “<?PHP … ?>” the pages are written using “>? … ?<” instead.
I just wanted to thank you, I really like the theme and its design.
Do you have a function that decrease the quality of the main image on the index page of this theme? Is there a way to increase that quality?
Never mind. Figured it out.
I think it would be very helpful to add a pagination feature in future versions. Currently it’s only listing an amount we set it to be.
Thank you for this nice theme. Testing it on different local machines, i found some anomalies ending in some php-errors. On my local developing machine i got some line-ending errors: “Parse error: syntax error, unexpected $end”. After a lookup in your code, i discovered that some opening <? -tags missed the “php”. That missing three letters caused all the errors ending with a blank page in my browser. I corrected the code, and now the whole thing works fine. On a other machine running mamp, the theme worked without problems (without altering the code).
Good day!
Prompt, how to change the size of the latest photos? I want to display it in full size.
Thank you!
If you find out, please post the response, I have the same desire, at least a bigger slice….
This is wonderful theme and I am in the process of testing it for my portfolio. 2 questions though:
Is there any support for images in portrait orientation?
Is it possible to remove the post title from the pictures?
Thanks. This is a great theme.
I am in the testing stage of using it for my portfolio but have 2 questions:
1. Is there a support for images that in are portrait orientation?
2. is there a way to remove the ‘post-title/number’ from the images?
Hello, love your theme. I have the same problem as stated earlier in the comments: the header labels go nowhere - Tags, Categories, Latest, Archives.
I downloaded this theme around the middle of July, and it seems you made some changes prior to then. Would my copy still need to be updated to reflect those changes? Is the newer version on the WP site? If I do have to upload it again, will I have to reconfigure my widgets and settings?
Thank you for creating such an attractive and ideal theme.
I downloaded the newer version of the theme and there are no files in the zip folder??? Please advise.
Nice looking theme! Although I have a couple of questions: You only have one image per entry, I assume it is possible to have multiple images in each entry? Also, can you remove the sidebar and have 3 entries per row across the page instead of two? How much customizing would that take? Thanks!
To do have 3 images across you need to do a few things:
1. Change line 67 in index.php so it will apply three different classes instead of two, i.e. from
to
2. Remove/comment out lines 94 to 98, which removes the sidebar
3. in styles.css change
.container #latest-photos {width:640px;}
to
.container #latest-photos {width:960px;}
4. Alter the styles for indentright and indentleft; and add a line for indentcenter to give:
.container .indentleft {margin-left:0px;}
.container .indentright {margin-left:15px;}
.container .indentcenter {margin-left:15px;}
you may need to tweak the margin sizes for it to look right
step one change to
php echo ($x % 3 == 0) ? “indentright” : (($x % 3 == 1) ? “indentleft” : “indentcenter” )
Great photoblog - please keep it coming. I’m new to photoblogging but looking to start soon. In fact I just registered a new domain name for it - photoblogging.com.au! Any tips to get started would be appreciated…
I love the theme but seem to have an oddity. http://www.davidkohlmeyer.com/Photography/41/
I installed the theme and plugin, downloaded directly from your website. Only that one plugin is enabled with wordpress 2.8.3 and I seem to be getting a secondary photo showing up after the main photo on post pages. I can’t figure out why either???
What plugins do you have running on the sample site above?
Also is there a bit of code or a plugin that could show thumbnails of related photographs? Similar to flickr how you can scroll through images from the set I would like to show photos from similar categories/tags. Any suggestions would be great.
I would really like to know how to use images from elsewhere instead of uploading one? So I could just display a photo from my flickr and if somebody like the image they could click it and go directly to the flickr set.
Finally, how can I make the theme automatically display the exif data along with each post?
Thanks very much for any advice or assistance.
Could you help me with changing where it says jamesAnn Photography up in the right hand corner, to being able to insert a logo there?
Hello mate,
First this is a great theme !
next thing is i want to add ABOUT ME widget box on the bottom side bar,
what is the necessary code for it?
also i have modify the theme with colors & background =)
Thanks,
Pinto.
I feel really dumb for this, and unfortunately can’t link my website for security reasons, but when using this theme, when I make a post, it displays the full sized image, then in the blurb about the image it shows a 460px thumbnail of the same image which links to the permalink for the very post it is in.. why is this? How do I turn this off?
Again I feel really dumb for not knowing, but it’s driving me crazy.
Thanks.
Uwagh, I’m so freaking stupid. I found what I needed until the YAPB options right at the bottom of the admin panel.
Now to find how to put a news post on the front page and I am all set!
I can’t seem to figure out how to get started? Where is this exactly?
” directly via the WordPress Admin Interface:”
Hi,
in wordpress 2.8 it’s easy to install new theme & plgin from the admin panel.
here is a you tube video for how to do it:
http://www.youtube.com/watch?v=DjoLF2xpxcs
Enjoy & good luck =)
This quote from Jimmy is exactly what I was wondering about.. I can’t figure out how to create a third column of images in an archive (or the main page for that matter). Also how can we have more than one image in an entry?
thanks for the great theme!!
“Nice looking theme! Although I have a couple of questions: You only have one image per entry, I assume it is possible to have multiple images in each entry? Also, can you remove the sidebar and have 3 entries per row across the page instead of two? How much customizing would that take? Thanks!”
An excellent theme! However, there is quite a bit of space between the title, and the menu with tags, categories, latest, archive, etc… It would have been better had this menu been pushed all the way up so that it was just under the title. It saves screen real estate and makes it so that those of us with laptops don’t have to scroll all the way down to see the image!
Great theme. I’ve got 2 widget questions.
I can’t figure out where the Left Sidebar Index would show up. No matter what page, nothing shows up. Could you explain? I can only guess the images are conflicting with it.??
Any way you can create a widget that shows up as Right Side Bar for ALL pages rather than just archive. The navigation on archives is helpful but people arriving at home page have only the upper nav - cool but not necessary intuitive for less experienced visitors.
THANKS! This is the only solution for posting artwork that I liked.
Michael
I removed the “Left Side Index” from the functions.php file in the hopes that the “Latest Photos” would not wrap and would appear as a 3rd column. Is this possible to do?
Figured it out. You also need to go in to the style.css file and change this:
.container #latest-photos {
width:640px;
to this:
.container #latest-photos {
width:960px;
Now, how to get it to only show 3 “featured-photos”? I have changed the general option in WP to only display 3 posts, but since there is a php call for a yapb photpost I cannot find an option to make it only display 3.
You need to change line 4 in index.php from
$current_post = new WP_Query(”showposts=5″);
to
$current_post = new WP_Query(”showposts=3″);
I like this theme alot but I can’t use it now. I would love to use this theme if it has threaded comment feature.
i’m not sure if these comments are monitored any longer, but i’d love to find a way to paginate the images from the front page… I know that folks can find the other images by viewing the archive or recent images, but it’d be nice to have a link at the bottom to visit older entries… can someone help me with that adjustment?
thanks!
-Cody
ARE these comments being monitored anymore? Somehow it doesn’t seem like it.
My home page displays 6 featured images — but I want it to continue stacking featured images down the page — say 60 featured images. Take a look — vintageprsguitars.com
I changed the container size to 1800px which made the page longer — but it still did not add more featured photos beyond six. ANY IDEAS how to get Phloggin to keep adding more featured photo containers instead of stopping at the most recent six?
Cheers and many thanks for any help you can give!
Sorry for the lack of administration for this blog entry and theme. Phloggin was initially developed to serve a personal purpose for us. But since we liked how it came out, we decided to put it out there for anyone who wished to use it, but only on an as-is basis. We purposely did not submit it to Wordpress themes since we never intended to provide any real support for it. However, if you have any specific questions or issues, I ask that you either post them in the commments for community help; or, you can email them to info@squarefour.net, and we will try to answer them. I cannot promise that we will be able to get to every email, but we will give it a shot.
You need to change the 5 in line 4 in index.php to whatever you want:
$current_post = new WP_Query(”showposts=5″);
Excellent theme, thanks much! I worked a day with it and it’s easy to use and fun to customize.
I am using this theme at http://photo.sirthinks.com .
With a few personal tweaks and a couple of hours messing with YAPB, the theme was up and running.
Great JOB!!
Hi - great theme it works very well.
So heres a question: I am organising my photos by category where each category corrosponds to a photo album. Would it be possible to allow the first photo from a category to display on the home page, rather than all the latest uploaded photos?
Thanks,
Dave
Hello I really love your theme!
I have try to installed it twice and it display blank page. maybe latest plugins didn’t support 2.8.6 or something else.
Not sure what happen. I was hoping you can give me some pointer.
Thank you
Http://images.jong.my
wordpress 2.8.6
Netster
Great theme! A couple bugs though..
One is that the next/previous overlap one another and are too tall for the container. I’ve removed the arrow graphic from archive.php and set the photo-nav container width to 100% in the CSS and now it looks nicer. Your demo site has no archive pages that span more than one page so that’s probably why you didn’t catch this one.
Still trying to solve another issue - old pictures seem to disappear from individual pages, but the files are still there and editing the post shows them as being there. Not sure what’s up, but at least this can be solved by re-uploading the picture.
Hi everyone. I’ve made a post with a recipe for my mosaic page, I’ve had a few questions about it, and thought I’d share it.
Read it here: http://iskwew.com/images/2010/01/20/my-mosaic-template/
very nice themes, will try at localhost first. thank you
Interesting theme… but do you know how to intergrate EXIF data into it? Would be a great help…
Hello
Congrats for this awesome wordpress theme! I have a problem. I can’t add PageNavi or other plugin for pages on the homepage. How can I resolve this problem? Can someone help me, please?
I am using this theme here: http://www.evenimente.hiphopblog.ro
Thanks!
Can somebody help me, please?
My website http://pentaprisma.nl uses your theme which I slightly tweaked to my likings. Now I wonder how I can integrate EXIF information into the theme. I use a wordpress pluging but it does not give me the results I want (which is: click on image and show exif instead of showing it in the description of the image).
Sorry for this comment. My webbrowser went haywire on me while editing this. Can you please remove?
I use your theme on my website http://pentaprisma.nl
I would like to add a function which shows EXIF information when you click on an image. Is there some javascript that I can use for this (wordpress plugins show the information in the description field which I don’t like).
Thanks.
Love your website
http://pentaprisma.nl/
Wondering..how did you change the size of the latest photo?
I’d edited style.css
.container .main-photo .main {
width:960px;
height:233px; … to bigger size.
But it doesn’t work. Please help. Thank you.
Me too.
I’d like to adapt the theme (latest image and image page) to any ratio and especially to something like 1.121px × 469px.
I can’t figure out how.
any help?
thanks in advance
bye
Hi Iskwew, I also read an update on the whole mosaic page item. It really works like a charm on my website http://pentaprisma.nl
Come and check it out. I’d appreciate your comments.
I am using this at Katanaville.com/gallery
and want to say how much I like it.
(At the main Katanaville.com page, the theme is Thematic-child theme, Commune)
I have a few questions.
1. How to get a link back to Katanaville.com in the top right corner.
2. How to add custom header graphic.
3. MOST IMPORTANT - some of my images are showing up as “Page not Found” even though it appears all the right info is there.
I sent an email, as well, regarding the third question, and of course would still like to give you a small art piece if you are able to solve the problem. Thank you!
Would please add side bars for single article?
Uploaded and installed like a charm. Just one question
When i click on a CATEGORY it is only showing 10 thumbnailed posts. I would like to show more then 10 or just put in 100.
thanks!
This article had been a excellent read! I couldn’t have explained things better myself.
Search high an low for this type of blog set up. Did use Pixel Post to start with but I wanted better SEO control and this fitted the brief.
YAPB is a bit quirky to start with, not liking the cache and the way it names image files, but what the hell this rocks and I’m happy.
Excellent work!!!!
first of all,thanks for this cool theme,this is exactly what i need and i checked the users which use thi theme,looks working great
but im really need help,im newbie for wp and it doesnt work for me,can anybody help me?
Make sure you have the yapb theme installed, then enable it by going to [YOUR URL]wp-admin/themes.php and selecting it there. It that doesn’t work, make sure you are using the most recent version of wordpress.
Hi Matt,i did all of them enabled theme and yap plugin but somethings wrong coz im really newbie at wp,can you help me about configurations? just send a blank mail to tbirinci@msn.com if you dont mind,
I have used this theme, but I cannot seem to get the same results as anyone else.
First problem is the photos on the front page are stretched and look horrible. What have I done wrong here?
On the posting pages I get a second photo, which is not what I want.
How do I remove the second photo?
Thank you in advance for any help
Ian
That’s weird, it’s outputting a gif, with two transparent bars above and below - no idea.
But, check everything on your server is up to date, and that wordpress is too.
-What other plugins are you using, and is YAPB up to date?
-Also, if you upload images which are at least 952px wide it will look better.
To get rid of the second image on the individual image page, go to Settings -> YAPB -> Automatic Image Insertion, and uncheck “Display images on SINGLE pages.”
Make sure that in Settings -> YAPB -> Thumbnailer options the default output format is JPG
Possible cross-post: Original message sent to email listed above:
I’m sending this with hopes that the plugin is still being supported. I get the following error when attempting to create an image post via the plugin:
Warning: filesize() [function.filesize]: stat failed for /tmp/phpaAk9Pb in /home/content/s/l/a/slapstick/html/wp-admin/includes/mu.php on line 15
Warning: filesize() [function.filesize]: stat failed for /tmp/phpaAk9Pb in /home/content/s/l/a/slapstick/html/wp-admin/includes/mu.php on line 15
Warning: Cannot modify header information - headers already sent by (output started at /home/content/n/u/s/nusolutions/html/wp-admin/includes/mu.php:15) in /home/content/s/l/a/slapstick/html/wp-includes/pluggable.php on line 868
I’m running this plugin along with the Phhloggin ver1.3 theme on a WPMU installation on GoDaddy. I performed this on a test server running standalone Wordpress 2.9.2 and everything worked fine. I’ve also increased the file sizes inside of my WPMU options to 100MB & 155000KB so I’m wondering what’s causing the issue as the image I’m trying to upload is only 136kb.
Any responses appreciated
Hi,
I have tried to install the theme and I think that I havefollowed all the instructions but nothing appears when I load the page.
In the installation process on WordPress, I received the message “images Stylesheet is missing.” but if i look tho the theme with the editor function, the style sheet is there.
Have any hints please ?
Thanks in advance
[...] » View the Demo » Download [...]
[...] Release Page [...]
[...] am using the “Yet another photoblog”-plugin and the “Phloggin’”-theme. The plugin is simply excellent, and the theme is very nice, in that it’s not just one [...]
[...] Foreigner Perspective | Demo | Descarga [...]
[...] Theme info Demo [...]
[...] Foreigner Perspective | Demo | Download [...]
[...] bloggers. Also there are exclusive themes that are aimed at the photographers/image artist like the Phloggin, Folio Elements and the Smashing [...]
[...] 84. Phloggin Free Wordpress Theme [...]
[...] 84. Phloggin Free Wordpress Theme [...]
[...] Nxxt we were approached by an up and coming music photographyer based in London to develop a photoblog and photo ordering system for her new business ‘Magic Photography’ For the photoblog we decided to go down the Wordpress route and found a great theme developed by Squarefour which you can check out here: http://blog.squarefour.net/2009/05/28/introducing-new-wordpress-photoblog-theme/ [...]
[...] 84. Phloggin Free Wordpress Theme [...]
[...] 25. Phloggin Free Wordpress Theme [...]
[...] Demo | Download [...]
[...] 84. Phloggin Free Wordpress Theme [...]
[...] addition I made some changes to the stylesheet, with a little help from my friends over at the Phoblog-thread and some trial and error to get the thumbnails into a square. Add the following to the bottom of [...]
[...] Phloggin [...]
[...] Demo | Download [...]
[...] 1. Photoblog theme [...]
[...] 1. Photoblog theme [...]
[...] 1. Photoblog theme [...]
[...] Phloggin Looked like an OK theme, but I got a fatal error when activating it. I investigated it a little, but gave up a little to easily here, perhaps. [...]
[...] 1. Photoblog theme [...]
[...] PhlogginDemo | Download [...]
[...] that will turn your wordpress installation into an awesome photoblogging engine. I am using the Phloggin’ theme currently but that might change. There are other YAPB-ready templates that you can [...]
[...] test | indir [...]
[...] Demo | Download [...]
[...] Demo | Download [...]
[...] Demo | Download [...]
[...] 7) Phloggin PhotoBlogging WordPress Theme By Squarefour [...]
[...] [...]