Reflection-Mod Photoblog Theme for WordPress
Theme Updated – 31st January, 2010 (Reflection-Mod 1.2)
Reflection-Mod v 1.2 Photoblog Theme for WordPress : Demo
Reflection-Mod Logo for Header (Photoshop PSD File)
Reflection by David Moxey is a beautiful WordPress theme for photoblogs which utilizes Johannes Jarolim’s excellent wordpress plugin, Yet Another PhotoBlog Plugin (YAPB). Reflection-Mod is my modification to the original Reflection theme to enable Category and Tag functionality and a host of other enhancements both in appearance and functionality. These include a number of slick Javascript slider animations that help unclutter the look of the site while still having all the relevant information/links easily accessible. I have listed the features of this theme below. For a detailed description of all the changes made to my theme since it’s original release, please check the Reflection-Mod Changelog. The best way to see the differences is to visit my Reflection-Mod Photoblog for a Demo. Also, be sure to check out my new theme – Refractal. This theme is meant to compliment Reflection-Mod as a similar looking theme for your regular blogging purposes.
Changes in Latest Reflection-Mod (1.2) (January 31, 2009)
- Lightbox (SlimBox) effects can be enabled for Category/Tag archive galleries: New in version 1.2 is an option in the admin panel to enable a lightbox effect for quickly browsing through images in your category/tag archives.
Lightbox effect in Category/Tag archives
- Disable/Enable automatic display of Shot Info (Post Text) with Photoblog Image: Admin panel option to enable or disable the automatic display of your Shot Info/Post text along with the photoblog image. Gives you this option depending on whether the image is of utmost importance or whether you prefer to display both the text and image as a single combined entity.
- Enable/Disable EXIF link in Photoblog
- Latest Theme Version Box in Admin Panel: The theme admin panel now displays the latest available version of Reflection-Mod with a link to the download page. Now you will always know if you have the latest version of the theme without having to actively check my site.
Features
- Implemented a multi-level CSS drop down menu: capable of displaying multiple levels of pages in the navbar.
Reflection-Mod - Drop Down Menu
- Improved compatibility with older versions of PHP: Introduced an option in the Admin panel to turn of AJAX browsing of images which should make the theme compatible with practically all webhosts and PHP versions. Also includes JSON encoding for better PHP compatibility
- Ability to change image quality: Implemented an admin menu option enabling the user to specify the image quality of images. Higher quality images will take longer to download. Can be optimized for a given webhost’s speed/performance.
- Support for a lower navbar: Make a separate unordered list in header.php with an id of “navbar2″ to create a second set of hard coded links in the lower row of the navbar. Can be useful for integrating the photoblog with a regular text-blog running the Refractal theme.
Reflection-Mod - Lower row of links in Navbar
- Support for Category and Tag listings. When browsing images in a category, Prev/Next image links allow you to browse single images within the same category. I think this is a key feature missing in almost all WordPress photoblog themes (Even Pixelpost). Note: You need fancy permalinks enabled in WordPress for this to work. If you have the default permalink structure, in-category browsing will not work.
- Widget ready sidebar (can be disabled): While I prefer to have a completely uncluttered look, I have enabled it to show how it looks. You can use any widget you like.
- Random images hyperlink now displays a slick slider that pops down with 7 thumbnails of random images from your archive. This allows the user to select an interesting image out of an assortment of random images.
Random Thumbnail Slider in Reflection-Mod
- Neat slider animations (Javascript – MooTools 1.11) for the Category and Tags listings, Random image slider as well as dynamically loaded comments.
- AJAX effects are persistent throughout the browsing process. In the original theme, clicking on Archives/Comments, etc would break the AJAX browsing mode and would switch to regular page loading.
- Robust Admin Menu with tons of options! Now you can control a host of options from the Admin menu such as Copyright Information, enabling/disabling tags, categories, sidebar, reflection-effect, header page listings, etc. This means you shouldn’t have to meddle with the actual theme code to get the look you desire.
- Downloadable Photoshop Template for creating customized header logo for the theme.
- MOST IMPORTANTLY: A brand new, matching text-blog theme – Refractal – that can be used on your website for a separate WP installation for the regular Blog component of your site. The two themes, Reflection-Mod and Refractal look and feel the same so it allows you to integrate your regular blog and your photoblog under one common umbrella!
Installation
Before you install this theme, please make sure that:
- You have installed the Yet-Another-PhotoBlog plugin correctly and that it is working. Follow the instructions on the plugin webpage to install the plugin properly.
- Once YAPB is installed, go to the YAPB options section in the Administration section and make sure to disable all the automatic image insertion options for the plugin. If you fail to do so, YAPB will conflict with Reflection-Mod and things will behave very strangely.
- Like Reflection, this theme requires every post to contain a YAPB image. If you wish to have your own content (without an image) add it in pages and not posts.
Once you have done the above:
- Download Reflection-Mod 1.2 Photoblog theme for WordPress and unzip the contents of the file.
- You should now have a directory titled ‘reflectionmod’. Copy this directory and all its contents into the wp-content/themes/ folder of your WordPress install.
- Once all the files have copied over, select Reflection-Mod from the Themes panel in the Administration section and activate it.
Customization
Creating your own Reflection-Mod Logo for the Header
This is one of the first things you probably want to change. (I presume that having your own photoblog under my name is not a very appealing option =) ). To make this process simpler for you, I’ve gone ahead and uploaded a Photoshop template for the logo. Download the Photoshop Template for the Reflection-Mod header and open it in Photoshop. The Layers in the file are labeled and you should be able to easily edit the text in the Title layer. Copy paste the same text into the reflection text layer to get your final logo. Of course, you can go crazy and make a much more creative logo if you feel like it 
.
For those who don’t have access to photoshop, it won’t be as easy, but creating a logo is still simple. Just open up the logo.png file in /reflectionmod/images/ in GIMP (Opensource software equivalent of Photoshop). Use the eyedropper tool to pick the color of the 1pixel gray line, and create a new 1px line of that color on a new layer and position it over the line in the original logo.png image. Then follow a tutorial such as this one to create the reflection effect on your text. Finally save your image as logo.png and overwrite the default file in the /reflectionmod/images/ folder.
Creating Archive/Mosaic Page
If you wish to have a link in your Navbar titled Archive or Mosaic, which contains an array of thumbnails of images from all your posts (grouped by year), then create a new page and make sure to select the Mosaic Page Template instead of the Default template. Unless you want to have some text preceeding the thumbnail archive display, you can leave the body of the page empty. If you have the “Disable AutoPage Listing in NavBar?” option unchecked, the Navbar will automatically update to show a link to the Archive/Mosaic page. If you do choose to disable the AutoPage listing option, then you will need to go into header.php and manually enter the URL to the Archive page as an “a href” link in the Navbar unordered list.
Creating an About Page
Create a new page titled “About”, but this time use the “Default Template” for the page. Enter whatever text you want (feel free to embed images too) and then save the page. As mentioned above, it will automatically show up in the Navbar if Autopage listing isn’t disabled.
Other Theme Customizations
Most of the other admin options are fairly self explanatory. The first few options deal with the Copyright information that is listed in the footer.
The portrait image width and landscape image width refers to the maximum width the images should have when displayed. Keep in mind that the value in these boxes should not exceed 800 as it will break the theme. (The theme is coded to have a maximum image container size of 800 pixels). The default value is 800 for landscape images and 450 for portrait images.
Sidebar
By default, the Sidebar is disabled. When you first enable it, it will say something like “No Widget”. You will need to add elements to the sidebar using the Widgets option in the dashboard. I am currently using the Subscribe Sidebar and the Yet-Another-Photo-Blog sidebar widget plugin on my photoblog. The latter is setup to display 5 recent thumbnails (100px width).
Permalink Structure for your PhotoBlog
I would strongly recommend that you use the fancy permalink structures for your photoblog. This will also enable in-category browsing of posts for this theme. The URL for your posts will look cleaner and the names are far more intuitive than a URL that looks like www.yourdomain.com/?p=XX . My favourite permalink structure for photoblogs is: /%category%/%postname%/ . Check the image below to see what your permalink settings should look like.
Wordpress PhotoBlog Permalink Structure
EXIF Data
To customize the Exif data that is displayed in the overlay panel, select Exif filtering in the YAPB options and select the different field values that you would like to have displayed.
Final Comments
Reflection 1.2 along with Refractal is a new update, and one that I wasn’t planning on ever doing, but made possible thanks to feedback from users and encouragement from a good friend (we have come to become friends due to this theme) Markus. So if you like the theme, let me know! I don’t expect everyone to donate but it really does help a lot to know that there are folks out there who find this theme useful and enjoying it . Also if there are any features you’d love to see, let me know. I can’t guarantee anything, but you never know!
Acknowledgements:
- The biggest thanks has to go to Dave Moxey for his Reflection theme. It has been a lot of fun learning PHP, basic Javascript, CSS and WordPress while I tried to modify his theme and I owe it all to him. I would never have started on this if I hadn’t fallen in love with the original Reflection 1.0 theme to begin with. Once I started setting it up I got more into it and decided to mod it to my liking resulting in this theme.
- Johannes also deserves a huge thanks for his amazing Yet-Another-Photo-Blog Plugin for WordPress.
- A big thanks to www.w3schools.com and all the other great sites on the net with some amazing tutorials that made modding the theme possible for a PHP/JS/WP newbie such as myself.
Questions? Please use the Forums
Related posts:
Hi Steve,
I’m going to look into this to see if there is an easy way to do it. Sorry if it takes a while. I just found out that my site had been minorly hacked last night (minor iframes insertion)
Cheers
Hi Sudeep. I installed the theme, the thumbs are generated (on the archives, or on the sidebar widget) but the main post doesn`t show. I have a blank page instead …
I allready used another YAPB them (Grain) and it`s worked with the post. So, the images exist but aren`t show …
Can you help me?
Here is the testing server: http://emi.floaredecolt.org/photography/
Thanks.
My PHP version is 4.4.7.
This is a problem?
The original Reflection theme is working with this version.
I’m not quite sure whats going on. For some reason it was displaying the “Mosaic” on your homepage when it should be displaying your latest picture. If you check my PbLog you will see that the archive shows up separately. Did you follow the instructions above on setting up the mosaic?
Also, are all your posts containing a single YAPB image? Also check to make sure that you do not have any post without a YAPB image (the theme is not meant to deal with posts without YAPB images). Your issue is probably related to your installation of WP or your permalinks if I had to take a guess.
I set myself the mosaic on homepage. Before was the latest post, and it show only a blank page. The same error (the problem is with the post page not with archives or page templates … if you see, the about page is showing, the same the archives or mosaic).
All the post are with YAPB images (uploaded like YAPB images) and contain only a single photo.
Hi Sudeep,
Thanks for the amazing photo theme. I think that it’s absolutely fantastic and I’m now running it here. I’m curious though, when I’m looking at your own photo blog it appears that there’s a thin black border at the top and the bottom of your main photo.
The overall result is that the <hr> tag at the top is about 19px above your photo and that the reflection at the bottom is separated by about 18px from the photo. I like the professional feel that it invokes and was hopeful that you could show us how you did that?
From what I can tell you’ve uploaded your normal image file but then when the 800px wide thumbnail is generated a 9px black border is appended to the bottom and to the top. Was it in a .js file that’s included with the theme? Or is it a change to a certain YAPB plugin file?
Thanks for your time,
Paul
Hey Paul,
Thanks for the compliments. I’m glad you like the theme. Unfortunately the look in my blog is due to my image postprocessing and not my theme
. I use Adobe Lightroom and the Lightroom Imagemagick/mogrify plugin to add a border around the image. In this case as you notices, it is only a border on the top and bottom. Implementing it in the theme would be way beyond my coding skill levels 
. If you use lightroom, I’d recommend looking into the plug-in. It is awesome and it enables you to create some excellent presets for exporting images for the web.
Cheers,
Sudeep
Dear Sudeep,
It’s really a perfect work that you’ve done, and have made the original reflection theme even more pro and good looking and functional at the same time. All of the features that you’ve embedded into it are all very useful and in-the-right-place…
there’s only one issue that I hadn’t been able to understand and solve even in the original reflection theme, and that’s what happens to the posted image…
I had decided to change my template and think I have finally found what I’m looking for. I was previously using the grain theme which I had modified a little myself too. This version of reflection template is just perfect but, as you may see in my one and only post… the image seems a little cripples around the shapes and any text which is seen in the photo, specially the watermark that I put on the photo…
I’ve also added the same photo which I’ve uploaded and is shown with reflection-mod theme to the info section of my post for you to see. It seems as if a second let’s say quality reduction or size-reduction is being applied to the photo after it is retrieved by the theme and is shown… this is something related to reflection theme I think, and something which I’m not doing right maybe to make the photo size or ? suitable for reflection based themes.
I would really appreciate it if you could guide me on this and tell me what I’m doing wrong and what should I do to fix it.
Thanks for everything in advance.
Kaveh
Hi Kaveh,
Thanks for the compliments. I’m glad you are enjoying the theme. I think I will try to make this a user option in the next release of the theme. In the mean time, you need to edit the file yapb_filter.php in the reflectionmod directory. Look for this function:
Replace q=70 with q=99 and see if that helps. Let me know if it works.
Cheers,
Sudeep
WoW… thank you so much Sudeep…
That fixed the problem like a work of a magician…
now it’s all in all perfect…
I should again thank you for this excellent theme, you’ve done a great job, Well done.
And you are enough thoughtful to provide us with the PSD file for the logo…
Thanks a million times Sudeep
And I noticed that you haven’t added your theme in the Johannes’e “Ready to use templates” page… I think so many people will miss the opportunity to use this perfect theme like me…
Thanks for your time and attention dear Sudeep,
Everything’s alright now…
Regards,
Kaveh
Hi Kaveh,
Great to hear that it worked out for you
. Good luck with the photoblog. I’m glad that other folks are enjoying the theme. I will try to ask Johannes to add my theme in his list. Have fun!
Cheers,
Sudeep
Hi Sudeep,
Thank you for a great theme. The modifications you made were exactly what I was looking for. I have been successfully running your theme for almost two months at http://www.richardhamiltonphotography.com
The one thing that the theme appears to be missing are slideshows. Are you aware of any way of automatically creating slide shows in your theme? If not, would you consider adding this feature
As a stop gap measure, I have actually created pages with embedded slide shows from my Zenfolio.com account. I have created slide shows based on the categories by manually creating folders in zenfolio, creating a slide show and coping the zenfolio slide show link into my photo blog. It works, but is a lot of work, not only to setup but to maintain as I always have to have photos in two different locations.
The stop gap measure also consists of separate pages for each the of slide shows which are linked to a main slide show page (which is accessible from the Nav bar). Ideally, I would like to eliminate the main slide show page and allow readers to click on a link to a slide show when they are viewing the photos in a category. This link for example could be to the right of the Category title on the white line (just above the photos). Are you able to suggest a way that I could do this?
Kind regards,
Richard
Hi Richard,
Nice website! I think a slideshow feature would be a great addition to the theme. Unfortunately I am really busy at the moment. I also think that implementing it will take quite a bit of Javascript work…something I’m personally not very good at.
The other problem is that YAPB and this theme are more tailored towards a photoblog which has a one image per page/post philosophy. Slideshow type functionality is meant more when you are displaying galleries using something like NEXTGEN Gallery. It might be tricky to access all your images and posts from YAPB and Wordpress on the fly for a slideshow. I think your current solution is probably the easiest although it takes twice the work since you have to upload your images in two spots.
I’ll put this down on my list for my next big update (if I can actually implement it). Unfortunately I haven’t had much free time to work on this off late.
Cheers.
Thank you Sudeep for the compliment and adding slideshows to your list (my fingers are crossed
).
Any suggestions on how I could program a link to the right of the Category title on the white line (just above the photos) thus allowing me to eliminate the main slide show page and allow readers to click on a link to a slide show when they are viewing the photos in a category page?
Regards,
Richard
Hi! Great mode you’ve made!
One thing though, im almost freaking out since i cant find any reason nor solving for this. Ive installed correctly, but i have no images, anywhere… Ive tried original reflection theme as well as two other yabp themes..and same happens! No image.
From what ive been able to understand, the images should upload to “yabp_cache” dir..They are not. From the source html in the blog all i can see its trying to get the image from the plugin dir, and no jpg reference. Ive been uploading with the yabp submit rollout too.. Ive checked permissions all is ok too… i dont have any more ideas to what i can do..but im beggining to feel it must be something related to new 2.8.5 version of wordpress…
Any ideas would be awesome! Thanks!
Thnaks for this great theme
I have the same problem. Wordpress 2.8.5 and YAPB 1.9.22
Can anyone help me?
Sorry for my english
Marc
Sorry guys, but it is probably some issue at your end with the host or php version. It definitely isn’t a WP 2.8.5 issue since there are others who are using it without any trouble with the latest WP release:
http://kaveh.ymer.org/
http://www.themattefinish.com/phlog
I’m sorry but I don’t really have any idea what could be wrong with your installations and why it isn’t working. Perhaps you should trouble shoot with other YAPB enabled blog themes and see if any work. If none work, it is probably an issue with the way YAPB is setup. In that case, I’d advise trying to use the YAPB forums to get some help.
Sorry I can’t be of more help. Let me know if you manage to fix the issue so I can add a note for others facing similar issues. Thanks, and good luck!
Dear Sudeep, One of my friends who I was helping to build a photoblog just liked your theme that I was using on my own photoblog so much that just asked me to make an identical photoblog like that and use the same theme for the photoblog… So I created a photoblog like that for my friend at this address: http://www.artapic.com
so your amazing and beautiful theme is being used with the latest WP installation at the address above… sadly I was asked kindly by my friend not to use the same theme for my photoblog, so that the newly built photoblog gains a uniqueness among all of the photoblogs in my country, which I think no one is currently using this theme with any WP based photoblog here… so I had to look for something new… I changed mine but will change back any time my friend feels a little bit more relaxed about the photoblog’s uniqueness…
I thank you again so much for your wonderful work with releasing this theme and making it available for everyone to have the chance of using it…
hi Sudeep, thanks for the mode. it works great except that my archive only shows one thumbnail and the rest of the thumbnails become much smaller dots. please help. thank you
sam
Hi Sudeep,
Absolutely fantastic theme. Setting it up was a breeze! I have noticed two minor niggly bits that I was hoping you could help me with if possible:
1. On images that are not that wide, the title of the image will overlap the links on the top right of the image. You even have this problem on your own blog in portrait images, for example:
http://www.sudeepmandal.com/photography/birds/baby-pigeon-chicks/
You can see the date overlapping the “Prev/Next”.
Perhaps there is a way to stick a line break in-between these so they won’t overlap? Or would that look too strange?
2. When I click “Prev/Next” when viewing images, I notice the reflection stays as the reflection of the previous image. Is there a fix for this, or should I just turn reflections off?
Many thanks!
WONDERFUL theme. 
Hello,
Thanks for the beautiful mod! You added everything I was looking for in the original Reflection theme.
Everything looks great, but Prev and Next are not working. It doesn’t work either on the images themselves, nor on the links above the images. It just gets stuck loading with the white screen and grey circle. The feature works on the original Reflection theme, just not on Reflection-Mod.
Any tips on what I can look at?
Thanks so much!
Hi Sudeep
Original reflections theme is working fine on my site but when i activate this one, it gives me the following error.
Parse error: syntax error, unexpected T_OBJECT_OPERATOR in /public_html/subzero/wp-content/themes/reflectionmod/index.php on line 68
Can you please help?
Hi bileu,
Unfortunately this is most likely because your host does not support PHP5. You can try what is listed in this comment:
http://www.sudeepmandal.com/projects/reflection-mod-photoblog-theme-wordpress/#comment-1871
See if that fixes it. Otherwise I’m sorry but I don’t know of any easy way to fix this issue.
Cheers
great great great theme, thank you a million!
Is there any reason why my site works with Reflection (1.0 and 1.1) but not your theme? When I load your theme, I get the header and sidebar, but no body or footer.
I want to check and see if anyone has done this. I see it on your site I want to add description on my photo (info) but I do not want to show the picture again what’s the best way to make this happen? I do not want to show the embedded photo basically. Thanks.
Remo
Well I found it
it’s teh plugin that does that so I unchecked it and now it’s great.
Ciao
Hi everyone
Anyone have the same problem like me about skip lines or spcae too much after inserted the photos.please see the layout in my site and using vertical scroll bar to see problem
http://andy.thahuong.us/blog
how can I fix it ?
Problems solved !
corrupted to WP-SliceShow plug-in, just deactivated this plug-in, then work well.
Is there a way to show more than 10 thumbnails when I select a category to view?
Andrew, if you check this article under “Changes in Reflection Mod 1.0.1″ you should have your answer
. It’s a WP setting thing that you can change, not theme related.
Cheers
Hi, Great theme! Thanks a lot
Wonderful theme.
Quick question, though — is it possible to increase the image size from 800 to, say, 900 or 1023? Or possibly use lightbox to display the original photo?
Hi Robert,
Unfortunately the theme isn’t setup to display images wider than 800 pixels. Also, it won’t be easy to integrate it with any javascript base image display routines. However, if that is what you are after then you might be better served with some regular theme with YAPB installed. It is easy enough to install a lightbox plugin for the image display in that situation.
Cheers
Just installed the new theme. Activated it. Previously, I’d been running Reflection 1.1.
Everything is fine except the archive page. I deleted the ‘Reflection’ archive page, added a new ‘Archive’ page via Reflection-mod, but I get this when I click on the archive link:
Fatal error: Call to a member function getThumbnailHref() on a non-object in /home/xxxxxxx/public_html/wp-content/themes/reflectionmod/archive.php on line 62
Help!
whoops — scratch that. I added a mosaic page instead of an archive page and it worked.
BTW — is there a way to tweak the number of thumbnails in the category view. I see it displays 10 — but the display shows 7 on top and 3 on the bottom, and it looks like there’s 4 missing (even though there’s not.)
Is it possible to display more (but display X on top and X on bottom so it’s even?)
Example:
http://www.metaincognita.com/category/iphone/
Hey Bobby, that is actually a WordPress setting you need to change. Thanks for pointing it out, it is currently in the Changelog: http://www.sudeepmandal.com/reflection-mod-photoblog-theme-changelog/
Check under “Changes in Reflection-Mod 1.0.1″ and it shows you what setting you need to tweak in your WP settings
That fixed it! Thanks again.
Thanks for the very nice theme! But I can’t find how to activate those Ajax popups when browsing images in Categories or Tags (like in your demo page)…
Hi Kitox,
Sorry about the confusion. Actually the AJAX popups (Lightbox) is a new feature in Version 1.2 that I should be releasing any day now
. So stay tuned and I’ll have it uploaded shortly (definitely within the next week).
Cheers,
Sudeep
Thank you again and greetings from Lithuania!
Hi Sudeep,
I must say that this is the best ever photoblog theme I have come across. I just love it. I had been searching the net untill I hit your site and yes I am glad. Thanks for your incredible work. Much appreciated.
However, there is an issue that I am facing with the reflection-mod theme though. Its the ‘Prev/Next’ that do not seem to work. The image space turns white and the grey loading circle turns on. The browser on the bottom left shows ‘error on page’, which is:
——————————————————————-
Message: Expected ‘;’
Line: 122
Char: 3
Code: 0
URI: http://nairarun.com/wp-content/themes/reflectionmod/js/blog.js
——————————————————————-
I had done the following:
- Installed Wordpress and databases.
- Loaded YAP plugin, activation and unchecked auto image upload options.
- Installed Reflection-mod theme and activation.
- Created Archive(mosaic) and About pages.
- Added posts.
Kindly help me troublshoot this error. Please have a look at my site and do let me know where I might be going wrong. Donno if I should poke my hands into blog.js
Cheers,
Arun.
PS: Earlier, I had tried the Reflection theme which worked fine.
Newest Uploaded Pics Don’t Show as ‘Latest Images’on Homepage. How to stop this?
Hi there,
I have several contributors who have uploaded images from their computer only to find that they don’t display on the website homepage.
When I look via admin at the published posts, the newly published photo is halfway down the page, not at te top as the ‘newest post’. For example, today is 7th Feb 2010. Some newly published pics have a published date of 7th Sep 2007.
If this something to do with the EXIF data of the uploaded image?
How can I stop it doing this? I would like it to display latest pics uploaded.
Hi there,
I think you need to check the YAPB options and disable the checkbox for uploading posts with the date from the EXIF. Then it should work normally with the latest WP posts showing up as the latest image posts.
Cheers