Wordpress Theme Me!
---
Posted on June 1, 2008 | Category: Tutorial
I’ve just found a great theme called Monochrome Gallery by Graph Paper Press. It’s a lovely white minimalist theme, with an elegant magazine style. But it took a bit of working out to get it going, though.
So, rather than cram the author’s comment box, I’ll post my instructions as a kind of mini appendix guide.
A live demo of a site using it would be great to see, to try it out before you install. You can find a great one here.
The “pullquote” option doesn’t seem to work in the slideshow (it just displays the first bit of the post). Any tips here would be welcome.
You can, however, get a pullquote for the previews if you use the “excerpt” function on Wordpress. Enter some text and it will appear in the bottom 5 small previews.
It took me a long while to get the thumbnails working. Go to Settings > Miscellaneous and change the default photo sizes, as the author suggests.
Ok, now go to a post you want a thumbnail for. Upload your images into the post as per normal. In the upload window, make sure you select the “thumbnail” option before you insert them into the post. This will make them the size you want eventually in the preview.
Ok, now switch to HTML view. Look for the code that deals with this image.
Now just copy the section of code that says http://yourblogname.com/wp-content/uploads/2008/08/yourimagename-128pxx128px.jpg
(Note: you have to select this section of the code because you need the “128px” embedded into the filename. This will make the image display the right size, and hence will appear in the thumbnail area.
The author’s screenshot of the fields filled in doesn’t show this all-important end bit.)
Paste that code into the left hand box of the “Custom Field” section, and type “thumbnail” into the right hand side. Hey presto! It should work.
-
This wasn’t too easy. The author writes in “1. Getting Started”
By default, the slideshow in Monochrome Author displays the most recent posts. The number of posts displayed in the slideshow can be controlled via your WP admin panel by clicking Options > Reading.
Actually this seems to be in Settings > Reading (in the latest Wordpress).
Ok, I’m still not exactly sure of everything I fiddled with to get it going after that. But, in essence, the key seems to be that you need to add photos to at least 5 posts - and add custom fields to all of these posts (in the same way as you added thumbnails, above) - for the slideshow to start working. Adding just one and ‘waiting’ to see if it will work won’t cut it! Add all five and you should be rocking.
I’ve already removed the background image to make a plain background, which is much better IMHO. The comments coming up quickly over the slideshow are a little jarring, so I’m going to try to see if i can have them static over the image, slower, or not at all (as in the live demo example at the top of the tutorial).
Other than that, a great theme!
Any other tips for getting this theme working can be posted here.
While you’re here, why not look around at the various themes on this site? It’s early days - much more great (very selective) themes coming soon!
» Filed Under Tutorial
August 2nd, 2008 at 3:21 pm
Thanks for posting this tute up to your website. I’ve spent hours trying to get the slideshow to work, and now it all makes perfect sense. If only the actual site had better instructions!
The only problem is that i still cant get the pullquote to appear in the slideshow (it just pulls the title of my post). Have you found the solution?
Nice idea for a site BTW
August 3rd, 2008 at 3:01 am
Hey, thanks for your comments. Let’s keep the discussion going and we’ll work it out. The theme is worth the effort, in my opinion.
I’ve got the excerpt working (the text in the smaller five boxes) but not the pullout in the slideshow. It’s our final challenge then. If anyone has any hints, let us know here!
August 3rd, 2008 at 8:21 am
[...] designer’s instructions left me with a few questions. For that reason, I’ve made my own tutorial for setting up Monochrome Gallery, that hopefully should get you set up and on your way as fast as [...]
August 15th, 2008 at 4:12 am
Thanks for this!
I’m having some troubles with the thumbnails though. When you say “You have to select the section of the code that has the “128px” embedded into the filename. The author’s screenshot of the fields correctly filled in doesn’t show this all-important bit. Adding the whole image HTML doesn’t work either - just that bit.”
I’m confused. You say first to copy the code starting from http:// and ending in .jpg. But then you say adding the whole image HTML won’t work??
So what do i actually need to put into the Custom field windows. The Key and Value fields? Do i put the same thing? Also, do i need to leave the code for my image in the post window when saving or remove that once i obtained the code the the image?
Appreciate your help with this.
August 15th, 2008 at 11:20 am
hey nikki,
i’ve made changes to the above guide - i hope it’s a bit clearer. it’s the sort of thing that’s hard to explain but easy once you’ve worked it out. i promise!
(1) yes, include the http:// and .jpg. in what you copy in.
(2) “The whole image HTML” - forget about that bit! i wrote that because usually *all* the image code should be posted into the field area (which contains the title, any link info, etc etc). With this theme you *just* put in the above bit, from http:// to .jpg, which is unusual.
(3) In the custom field windows you put in “Thumbnail” in the right hand side, and your image code (from http://…128pxx128px.jpg) in the left hand side.
(4) You can go ahead and delete your old code from the post window. I was just my easy (ish) way of finding out what code to copy.
I hope that’s clearer! Let me know if it isn’t, and how you get on
September 29th, 2008 at 1:40 pm
I love what you did with your ‘demo’ - how did you get the header graphic instead of the text header? Or do you have the Pro theme not the free one?
Thanks - great looking site - and it’s too bad the Monochrome developer didn’t spend more time on documentation - it’s one of the best mag themes going and could easily be the best with a decent tutorial!
Most of us really don’t have the time to mess around trying to make a theme work!
October 3rd, 2008 at 8:45 am
Thanks you for informations
October 9th, 2008 at 3:29 am
I’m still having a difficult time getting the slide show and thumbnail pictures to display with the proper sizes. Could someone post a screen shot of a post page that shows me how the boxes are supposed to be filled out.
Just learning and a little confused…
October 9th, 2008 at 6:55 am
Melody,
You don’t need the ‘Pro’ theme to get an image header. Here’s how:
(1) Make a 950 x 190 pixel header in software like Photoshop. You can make it taller if you like but the width matches the navigation bar width. If you want an easy way to match it - save that header to your desktop and completely change everything BUT the size.
(2) In a draft post, publish that header. If you want to get fancy, make that image a link to your homepage. Switch to HTML view and copy ALL the code you used to do that. (If publishing changes the size, just remember to return it to 950 x 190 pixels where you see the numbers.)
(3) Go to the “header.php” file in the Design > Theme Editor. Now copy that code AFTER the code for the search box, but BEFORE the bit of code for the navigation menu.
(4) Save and open your blog in a NEW window (this means you can easily change windows and fix any accidental errors).
You should see the header in the right place, but now you have two titles - a text and an image version. If you want to delete the text version…
(1) Do a search for a section that is labeled
< !_ _ Logo _ _> (with hyphens instead of underscores)
delete it (or “comment it out” if you know how) and replace it with some blank spaces (if you know how!). It’s hard to write comments with code, but if you need more information I’ll write a special post about it.
A tip - you can use the same process to put in ads, special offers, or anything on the top of your blogs.
Grant,
I’ll see if I can get onto this. If anyone else can do it before me - let me know the link to the screenshot. I’ll give a guaranteed link to your blog for anyone who does this
October 22nd, 2008 at 8:16 pm
Awesome tutorial. I still have a question with regards to shortening the excerpts shown underneath the five different categories. I’ve looked all over for it and I’m assuming that I’m overlooking it. The code listed in the index.php file is . If you can point me in the right direction, I’d appreciate it. I really love what you’ve done with shortening the excerpts and then showing other post headings underneath.
October 23rd, 2008 at 1:42 am
Thanks Matt. I’d like this to be as easy as possible
I just use the Advanced Options > Excerpt box under the edit box and make the Exerpts really short… is that what you mean?
October 23rd, 2008 at 2:48 am
It was and thanks for the reply. I’ve actually just found this solution to change it within the function so that there’s no need to add your own on each individual post.
http://www.lancelhoff.com/2008/09/06/change-the-excerpt-length-wordpress/
November 6th, 2008 at 10:34 am
Here’s a fix for the slide show!!!
If it does not work, check what plug-ins you have activated:
for me the “Lightbox 2″ image plug-in was causing the problem.
As i deactivated it, the slide show on first page was back! Hope this helps you, folks!
November 6th, 2008 at 7:32 pm
Wonder if just me everyone else has experieced this defect: in IE7 the caption over slide is not working.
It gives an runtime error of line 542.
I found it is in jd.hallery.js, following lines:
element.getElement(’h2′).setHTML(this.galleryData[this.currentIter].title);
element.getElement(’p').setHTML(this.galleryData[this.currentIter].description);
Replace them with:
element.getElement(’h2′).setHTML(”foo”);
element.getElement(’p').setHTML(”bar”);
will get it working like as in FF, but of course each slide will have foo/bar caption.
Help appriciated
December 16th, 2008 at 7:39 pm
hi!
Thanks for your tutorial, it really helped me a lot!
I am just wondering if you ever figured out how to turn off the commenting popups in the slideshow ? That bothers me as well, and I am hoping to figure out how to do it relatively painlessly. This is my first foray into wordpress and it is perhaps a complicated one to start with.
Thanks!
December 17th, 2008 at 12:22 am
Well done with jumping into a tough one! Your site looks a million times better, by the way. And if you keep a window open for changes, and another window open to see the results - you can’t really go wrong : )
Turning off the pop-up comments is really easy (fortunately). Go to
Main Index Template (index.php)
Find where it says
showInfopane: true,
Near the top. Change the ‘true’ part to ‘false’. Save. You’re done!
Also - if you want just ONE featured post there (to make it completely static) you can change the line:
timed: true,
to read ‘false’.
Combined with the first edit removing the comments, this would also gives you a purely static image there.
You might also want to add a little more text in your right hand sidebar for balance - perhaps a welcome message above or below the contact details. And be careful of typing your email address for spammers - go to http://services.nexodyne.com/email/ to make it an icon
I hope that helps! I’ll add all this to tutorials soon.
December 17th, 2008 at 3:40 pm
Ah, that was easy, thanks!
The sidebar, I am trying now to figure out how to get another category of posts in there, like the demo shows. I suspect that is a feature of the pro theme… and yes there will some more content in there. Also a graphic header is on the boards for today too.
Look forward to more tutorials
cheers!
December 17th, 2008 at 9:21 pm
The fancy sidebar is a pro thing, but there are always work-arounds. For instance, you could post a small image that stays static, but also put in code to list your recent posts, comments, or whatever you want.
December 17th, 2008 at 9:25 pm
Wow Katie, your site looks great. Did you want to share with us how you got your categories so nicely in the sidebar?
December 18th, 2008 at 12:03 am
ah the secret is, I got the pro theme (because I wanted to have some posts to show on the side, and possibly under the slide show) and promptly broke the slideshow! so now it doesn’t work anymore but if I go back to the gallery it does.
deactivated my plugin (I had next-gen gallery going) and still no luck, so looking this up now…work in progress!
December 18th, 2008 at 12:15 am
ah! i figured it out.
for the pro theme, the posts have to be in a category, and also in “uncategorized” (i.e. category id=1) for them to appear in the slide show.
December 21st, 2008 at 12:07 am
[...] theme blog (wordpresstheme.me) You can read the section on how I got monochrome gallery to work at http://www.wordpresstheme.me/monochrome-fix (I’ll post how to fix the slideshow when I get that sorted too). Thanks for a great theme!Hi [...]
January 4th, 2009 at 7:54 am
[...] article is still at this location. Moving [...]
January 7th, 2009 at 12:27 pm
[...] designer’s instructions left me with a few questions. For that reason, I’ve made my own tutorial for setting up Monochrome Gallery, that hopefully should get you set up and on your way as fast as [...]
January 16th, 2009 at 9:18 pm
Hi, since this blog seems to have all the answers on the Monochrome gallery theme, maybe somebody know where the code is located that gives italic texts a yellowish background colour? I can’t seem to find it in the css so I’m guessing it’s somewhere else, but where … ?
February 8th, 2009 at 3:28 am
How can I change a picture on the slideshow on Monochrome Gallery? I want to leave the posts/categories the same, but I’d like to change one of the pictures. Does anyone know how to do that?
I thought I could do it in the formatting.php, but don’t know what to look for.
Anyone? Anyone? Bueller?
February 8th, 2009 at 3:43 am
I don’t think I was very clear in my prior post. What I need to do is, if you look at my page http://dagagogreen.com/earthgirlz , you’ll notice the images for the last four posts are fading in and out through the slideshow. Well, the I want to leave the posts as they are, but have the slideshow skip on of the pics. How do I do that?
Where is the slideshow programmed from? Does anyone know this?
I get a huge headache every time I get into this bidness.
S . O . S .
February 8th, 2009 at 3:48 am
Hi Roni,
nice simple site. i’m still not sure what you mean - there are only three posts coming up in the slide show. did you want five? or none? or one?
February 8th, 2009 at 4:18 am
well…ya see I have six girlz and one EG Entry Info cat? Well I want that to stay the same as it is, but I wondered if there’s a way to pick what images are on the slideshow?
Instead of selecting the last three or four or five posts to toggle through the slideshow, I would like to select the posts I want to be featured on it. Maybe the first EarthGirl and then the third and then the last one, or something like that. Is it possible?
You know what else I’d love? The last (sixth) EarthGirl to be on the end of the first row. For some reason, if I add the last category (”EG Entry Info”) which I’d want below the first row of categories, the six category slides to the bottom row.
However, before I added the last EarthGirl, the EG Entry Info sat pretty on the end of the first row. I don’t get it! Argh!
I had that happen before
February 8th, 2009 at 4:20 am
Please disregard the “I had that happen before” fragment on the end of my last post. TY
February 8th, 2009 at 4:34 am
well, you can only fit in five previews along the bottom. but you can select which, and in which order, by changing the category numbers in index.php. look for the part that says
– BOTTOM LEFT FOUR CATEGORY LISTINGS –
and ALSO the bit that says
– LAST CATEGORY LISTING - NEEDED TO END CSS COLUMNS –
(They’re split up)
That should show them all. I’m sure someone has been more creative in picking just a few of these categories to display in the slideshow…
February 12th, 2009 at 2:12 am
Hello mate,
Red all your suggestions and tutorial on the main website of the theme. NOTHING working still. Am i too gree for that? Thumbnail do not work. Nothing seems to work at all with this theme. Usinb WP 2.7.1 latest version as far a I know
February 27th, 2009 at 12:39 am
Hi, I’m redo-ing my organizations website with this theme. I got the slide show to work but how do I get any text in there? The pullquote custom field is not working at the moment, any ideas? Thanks in advance,
Julian.
March 19th, 2009 at 8:25 pm
First, thank you guys SO much for creating this resource of help. I love this template, but am not experienced by any means in setting up wordpress sites.
I’m having some issues having my images even show up in my posts. I’ve been following the directions for the thumbnail photos, but it results in nothing showing…any suggestions?
i followed the directions verbatim…so not sure what is up.
March 19th, 2009 at 9:34 pm
Hi Again,
I got the thumbnails to appear in my posts…but not at the “categories” section at the bottom. Does anyone know what might be the problem? I just get text. But no pictures.
i’m sure i’m being negligant…
April 1st, 2009 at 1:09 am
I have no clue what happened- with my last post, the image thing didn’t work- none of the pics are showing up- I didn’t have a graphic plugin, the only plugins I’m using are aksimet, bastats, eventcalendar,customizable permalinks,feedburner and flickr widget.
I added the flickrwidget after the photo issue started,and it’s not even working- but I’m new to flickr so that might be why.
I don’t know- everything used to work and now it’s not.
Every time I upload it says image size is 0×0- I don’t know if that’s the problem or the fact that the custom field has an error message each time i try to use it.
April 10th, 2009 at 10:34 am
Hello,
First of all, thanks so much for the tutorial. It helped me a lot and also the comments and questions.
Now I have a wonder how Roni got 6 categories on a row? So far most of the sites I have seen only feature 5 catergories on one row. Please, I would really want to know the secret!
April 28th, 2009 at 6:41 pm
Hi, this is great. Thanks for these instructions.
One question: you mentioned in order to get the tn images to work, one should paste the following codes to the CUSTOM FIELD:
“Now just copy the section of code that says http://yourblogname.com/wp-content/uploads/2008/08/yourimagename-128pxx128px.jpg”
Could someone point me to where this custom field is?
Thanks.
April 28th, 2009 at 8:54 pm
Hi all,
I figured it out. Thanks anyways!
April 30th, 2009 at 8:55 pm
Hey guys,
I have this theme setup and working as I want it, except for one thing:
The size of the slideshow is not static and this means that when I publish a portrait oriented photo, it is cropped. I have no control over where the crop is made. Do any of you know how to either: a) dynamically resize the slideshow on each image load or (b) specify the crop used???
Would appreciate if you could email replies to adam [remove-this] tsiopani [at] gmail [dot] com
Thanks,
– Adam
April 30th, 2009 at 9:03 pm
Correction to my post, second paragraph : the slideshow IS static!
See what I mean here: http://www.adamtsiopani.com
June 5th, 2009 at 4:47 am
Have you been able to figure out how to get the arrows on the slide show working? Or even better, a numbering system so people can click on the slide they want to view? It’s annoying to have to let the cycle run through to see a slide again.
Also, on the category pages, what’s the deal with the thumbnail and the weird spacing? I can’t change the align for some reason and I can’t get the text to wrap properly.
June 21st, 2009 at 11:12 pm
I’ve been looking for a way to do this, but I have yet to figure it out…if it’s at all possible, how can I change the width of slideshow?
thanks for any help/suggesstions
August 5th, 2009 at 7:05 pm
I love your Demo!! How the heck did you get the slideshow to all be perfect sizes? My slideshow is showing different sizes
September 8th, 2009 at 8:49 pm
Hmm, I seem to be having a HUGE problem.
I got rid of the middle part of the website, and shifted everything up using the given CSS tags, BUT, my 5 categories section doesn’t work - it’s never worked. Not even before I made my changes. The category titles dont’ show up above, nor do the buttons take you to the category that you’re supposed to be “viewing”
here’s what I’m talking about (pardon the random text and categories. I was getting fairly frustrated)
http://lps.limewebs.com/
September 9th, 2009 at 5:16 pm
When I select category, there seems to be a format error (I did not change the defaults) with the resulting list on my site http://www.laoamericanmagazine.com.
http://www.laoamericanmagazine.com/?cat=13
http://www.laoamericanmagazine.com/?cat=14
the section “Recent Posts” is suppose to be a sidebar. Also the last post has a format problem. I expect the category results to look like a normal search result http://www.laoamericanmagazine.com/?s=lao.
Thank you for any help.
September 10th, 2009 at 5:35 am
Please ignore my previous post — I found the error
October 13th, 2009 at 5:59 am
I have the Pro version of this theme but I can’t get the ‘pretty’ permalinks to play nice. The theme is fine when set in the default mode but as soon as the permalink settings are changed the site gets muddled and looses all posts from the home page? any ideas?
October 23rd, 2009 at 10:24 pm
Hi,
I want to start off by saying thanks for such awesome content. So far, it’s been really helpful. Bu I have been having some problems that I would like to figure out.
1.) In almost all of the examples and other sites that I have seen using this theme, people have been able to add space between their posts and their images. I can’t figure out how to do this; it makes my site look more homemade, and I don’t want people to know that it is.
2.) I would really like to know how to change the background color and the color of the links. The default is red for everything, and I would much rather a blue or a green. Others with this theme have figured it out, but I’m too scared of breaking this theme to play around with it because I don’t know how to fix it afterward.
3.) I also really wish I knew how some people with this theme have figured out how to put the title of the post UNDER the picture… so that the thumbnails line up.
4.) And finally, my slideshow pictures are SO SMALL. they only take up about 40% of the slideshow space. Nobody else that I have seen is even having this problem. Do you know how to make the image take up the entire space?
I really don’t mean to be a bother to you or any of your subscribers. But I haven’t found any other bloggers that have shown as much know-how or as much interest in customizing this theme. I’m just getting started on the internet, so I need all the outside help that I can get.
And to anybody that responds, thank you.
March 21st, 2010 at 12:37 pm
Hello, first of all thank you for this post, it helped me a lot with my coursework, it’s the first time I’m making a website and without all this help I wouldn’t be able to work it out;)) But still I would like to ask you about two things. I can’t start the slideshow, although I’ve added photos to 5 posts and added custom fields to all of them. Is there anything else I need to know?
Second thing is when I open the category, some posts are displayed where they are supoosed to be and the rest is displayed right from the edge of the screen, which looks a bit untidy.. Sorry for my english;) Hope you know what I mean, have a look at my page: http://www.joanna-ornowska.co.uk
If you could help me, I will appreciate! (I’ve got the submission tomorrow;)
March 22nd, 2010 at 5:35 am
it seems you’ve got it worked out! just keep adding images of the right size, and custom fields. clear your cache and wait for those changes to take effect…