Incorporating images into your posts is one of the most stylish and effective things you can do to enhance the appeal of your content. Thesis comes pre-equipped with sexy image styles that you can apply on-the-fly, and you’ll love how easy it is to tweak your images to get the exact results you want.
Check out the newest section of the user’s guide, entitled How to Style Images in Blog Posts, and learn how to rock your images like a pro!
Important Note: As of Thesis 1.0, the updated stylesheet is obsolete. The new version of the theme has everything you need to rock the image styles discussed above!
Finally, be sure to subscribe to the Thesis feed—you’ll receive all the news you need about theme updates, extensions, new documentation, and tips that will help you run a truly killer site.
{ 1 trackback }
{ 55 comments }
Thanks for writing this, Chris. I had noticed the new nomenclature in the WordPress image uploading box, but did not realize there was actually a new set of classes to go along with it.
Thanks also for clarifying the widths, especially with respect to the max suitable size for the aligned right and left ones. I have not ever gone beyond 220px on such images (all were unframed) , and it’s good to know I “got it right” without really knowing it.
I really should make more use of pictures, and of frames when I do use pictures. Thanks for the good reminder of the value they bring to the table.
I purchased your thesis Theme. I paid for it. I have a receipt. I have a charge on my AMEX Card. I have a user id on your site “hamgva.” When I log in, however, it says “Oh My God, You have not purchased any themes.” I cannot get to the download. I also sent a message with receipt attached to sales at diythemes dot com. What gives? How do I get the download and recognition that I actually paid for your theme?
Gary — For some reason, my membership software thought your transaction was still pending. However, one look at PayPal indicated otherwise, so I manually adjusted your user settings to mark the transaction as completed.
I’m truly sorry for the inconvenience! You should be able to download the theme without a problem now.
Chris — You may want to look and see if clicking vs. not clicking the “Return to Site” link on the PayPal checkout page affects whether or not aMember recognizes and logs the completion of the transaction. I do know that this is an issue with some other e-commerce services/packages I use that integrate with PayPal, so it’s worth a look. You may want to add some text to the page before the user gets sent to PayPal related to your findings on this.
Robert — Thanks for the tip! I’ll be keeping an eye out for this.
Hello Chris I was wondering if I could just get the thing you’re offering to create your own because I would rather get that then buying the whole template.
Nick — Everything contained in this demo site is intended to serve as supplemental material for people who’ve purchased the theme. If I were to give you the stylesheet, then I would really jeopardize my own integrity with my customers. Of course, I’m not even willing to think about going there, so unfortunately, I can’t help you out.
Despite this, one thing to consider here is the fact that when you purchase Thesis, you are really purchasing a membership to the theme. Supplemental styles, detailed how-tos, and downloadable add-ons are all membership benefits, and based on the feedback I’ve received, people feel like the theme is an outstanding value.
Don’t let the price tag scare you—I’ve charged clients over $10,000 for a single site before, so $87 is borderline larceny
*sigh* I just wish those images were 500 pixels wide – that is the default “medium” size for Flickr. I often post photos there, and then copy over and post them to my blog. I hate editing CSS (which makes my eyes bleed, as has been documented online before – just Google it), so I’m stuck either resizing all of my images to a smaller size or with bleeding eyes.
*pout*
Just had to share in case it made a difference in options in future versions.
Christine — In addition to the myriad options available to users in Thesis 1.0, the new version of the theme is also much, much easier to modify. In your case, it would be quite simple to increase the size of the content column to accommodate your standard, 500px-wide images. In fact, I’d love to work with you on nailing down a solution that will make your image-handling life easier. If you’re interested, simply drop me a line: diythemes – at – gmail dot com.
Also, it’s worth noting that the image rotator (in the upper right) works off of standard image size ratios, so it will gracefully handle your 500px images without you actually having to do anything!
Chris,
A couple of questions:
Is there a link that describes specifically how to create a static home page in Thesis that I can check out. I know you have them for Cutline and so fourth, but does applying the tips on your other themes work in Thesis as well?
Also, with regard to the Nav links in the header, I’m wondering about the same thing. Is Thesis different? I use Copyblogger on one of my domains and I can make the Nav links, but I can’t add content to them. When I click on them, I get a 404 message.
Thanks
Chris,
Is there an easy way to make the images selected for the rotator link to specific blog posts?
I can’t seem to find it via google or the normal tutorial routes.
Only if you get a chance,
Andrew
Eric — In Thesis 1.0+, you control the contents of the nav menu entirely from within the Thesis options panel. Also, creating a static home page is a standard WordPress procedure. The only caveat here is that Thesis will detect the fact that you’re using a static home page, and it will automatically make the “home” link point to that particular page. Therefore, you won’t have to include this page in your nav menu; you’ll just need to include the other pages that you want in there.
Oh, and it looks like you got that 404 issue resolved… If not, let me know, and we’ll work it out.
Andrew — In Thesis versions up to and including 1.0.2, there is no easy way to link the rotating images. I’m going to add this functionality to the next release, though, so keep an eye out for that.
Chris – I appreciate the reply. You are good to your customers. It makes the product worth every penny.
I’m curious though, you said “no easy way,” is there a difficult way I should spend midnight-to-6am looking for in the templates? Or are you saving me the trouble by just saying, “wait till next time.”
I know my site isn’t much yet, but it’s got big hopes and dreams.
I noticed you probably said “no easy way” because my question clearly asks for an “easy way.” Point taken.
Andrew — In this case, even the hard way is a total pain. I’m gonna fix this in the next release, though!
I’ll definitely take your word for it. I look forward to the next release, it would also be good if you could relate the image in the rotator to specific posts. But anyway, I’ve taken up enough comment space as it is. Thanks for everything.
Chris,
I was wondering how you can change the colors from the standard yellow, when I place Your alert text goes here! tag in thesis.
As far as the 404 message goes, I don’t have that problem on Thesis. I use copyblooger on another domain. When I created new nav links in the header, they are visible, but the problem is that when I click on them, I get the 404. I don’t know where or how to add content in those 404 pages – I’m definitly missing something there.
Thanks for your help – again. I’m trying to solve these issues on my own, and I kind of feel bad writing you with my newbie questions, but I’m learning alot thanks to you. Soon, I hope to be independent. I’m really happy with my site and I’m getting alot of compliments on the design. Couldn’t have happened without your time creating this absolute gem.
Thanks very much
Chris,
Whoops – that would be the p class=”alert”Your alert text goes here! tag…that didn’t post to the message I just sent you – more newbie action.
Andrew — Using the custom fields defined in the Multimedia Box section of the Thesis options panel, you can assign specific images to individual posts and pages. If your server supports direct URL access, you can use the
imagekey, input your image’s URL into the value field, and then Thesis will do the rest for you. If your server doesn’t support this setting, you’ll need to workaround the issue by utilizing thecustomkey, and then you can input a validimgtag reference in the value field.Eric — You can change the colors of the
alertandnoteboxes with your custom stylesheet. Add these two declarations, and then you can tinker with different color schemes to find one that’s right for you.Chris, what about changing my header graphic? There are no instructions for this inside the User Guide, unless I am being an idiot.
ROCK ON!
Lawton
Chris,
Hello – I have no idea what a lot of these words mean and so I’m afraid my questions may be so basic that they’re laughable. But here goes:
A)
I currently have a personal blog that is hosted on Lunar Pages. I want to move it to a free wordpress blog.
If I buy Thesis, will I still be able to transfer all of my current blog content over to the thesis template? I use wordpress already as my, um, blog writing place. (sorry to sound so lame!)
B)
Also, I have looked through all of the other folk’s links who are using thesis and none of them seem to be on a free hosting site, they are all dot.coms. Will thesis work with a free blog?
C)
Will there be a way to change the font used for blog titles etc?
D)
Will all of that be easy for someone who has no idea about the “inside” of website to figure out?
E)
Is there a trial period in case I can’t grasp it all?
F)
What does “magazine style mean?
Thank you.
Kari
Chris,
Thanks, man. That did the trick. I really appreciate the help and I especially appreciate the time out of your busy schedule. Thesis has great support (as the buttons suggest).
Have a good one!
Lawton — There are a couple of good threads in the forums that cover header images. You can read up on clickable header images, or you can simply check out the general header image thread.
Kari — Here we go, in order:
Chris, what about changing the custom coding on the multi-media box?
Where can i change the sizes to match say a 300×250 size Thesis ad?
Lawton — Please post your questions to the Thesis forums. Thanks!
Chris, I’m thisclose to migrating my blog from Wordpress.com, using Blue Host and Wordpress.org. I love the wonderful typography of Thesis—and many other elements. It’s truly a beautiful, flexible theme. What I’m hoping might be easy to do [I know next to nothing about editing CSS—actually, make that nothing] is replace the rotating photo with a similarly sized space that could include linkable text and photos. Although I could also just build an image with type in PhotoShop and have the whole thing linkable. Is something like this either currently doable or on the horizon? Thanks!
Terry — In Thesis versions up through 1.0.2, the rotating image space can be used for images, videos, or custom HTML. The latter is exactly what you would need to accomplish what you’ve described. The text wouldn’t be styled by default, but you could certainly solicit the help of users on the forums to figure that out.
Chris–I want to order Thesis, sooner rather than later, but I don’t do PayPal. Can you please email me to discuss alternative arrangements? Thanks!
Terry — You don’t have to be a PayPal user to complete a transaction with DIYthemes through PayPal. You can use any major credit card or an e-Check to get the job done, and because PayPal handles the actual transaction through a completely secure protocol, you won’t be risking your information.
Chris – Thanks for all of your work. I find if I pay attention and follow the direction as you’ve laid them out, you’ve created a thing of beauty and simplicity.
Chris—I’m now rebuilding my blog Blue Kitchen in Thesis, using Bluehost and wordpress.org. Way more hands on than I expected, but I’m slowly working it out. Right now I’m trying to figure out how to put in my custom header in place of the type on the standard version. I’ve found various things on the support forum, but I’m wondering what is the most up-to-date information regarding this. If there’s a straightforward approach to this, it might make a useful link, similar to your “How to Add Custom Backgrounds” link.
Never mind, Chris. I dug a little deeper in the support forums and problem solved! Thanks.
Chris—
A couple of questions. I’m moving my wordpress.com blog to Bluehost and wordpress.org, using Thesis. While I get it ready for “prime time,” I’ve been using the URL http://blue-kitchen.com/test. When it goes live, the URL will be http://blue-kitchen.com. First, is this cool for being in Thesis at the non-developer level? Once I switch to the second URL, the other will not exist.
My second question is, as I customize my Thesis blog with the former URL, will the changes still exist when I switch the URL? Or should I go ahead and make the URL switch before making more changes to the theme? Thanks!
Terry B — You’re totally cool on the Personal/Developer front, so don’t worry about that. Now, regarding your site changes, you’ll want to install a brand new version of Thesis in your root directory when you’re ready to make the switch. In addition, you’ll need to overwrite the
/customfolder and the/rotatorfolder with the corresponding folders from your test installation.Finally, you’ll need to reset your Thesis options on the new installation. Once you’ve done all that, you’ll be ready to rock and roll!
Chris, I’m confused. According to Bluehost, I can just make some changes to my public_html folder and that will redirect the test installation seamlessly and transparently, or so they seem to say. Below is part of a response I got from them; if this seems to make sense to you, I may have them walk me through the process on the phone:
The main domain on the hosting account uses the public_html folder for all of its Web site files. Any addon domains use subfolders inside the public_html folder. In order to also set up your main domain to use a subfolder on your hosting account you will need to set up a redirect in the .htaccess file in the public_html folder so that the server knows that any request for your main domain will be redirected to a subfolder on public_html.
Visitors to your Web site will not be able to tell that your main domain is using a subfolder, they will still see the Web site address as http://www.yourdomain.com/page.html
What do you think? Thanks!
Terry — You could theoretically involve the use of .htaccess to simply “point” to your
/testfolder, but do you really want to have your site set up that way?If it were my site, I would want my WordPress installation in my root folder instead of a secondary folder in the root directory. The secondary folder seems “hacky” to me, and when you consider the tiny amount of work required to get Thesis running in your root directory, I think it’s definitely worth it in the long run.
Also, I don’t know if the .htaccess folder redirect would cause problems with WordPress’ .htaccess redirects, but I wouldn’t be surprised if there ended up being a conflict there. If I were advising you as a client, I would say that you should absolutely take the approach I shared with you in comment #34 above.
Chris—I’ve switched over from my /test blog to the “real deal” and it’s looking beautiful in Firefox and Safari. But in Internet Explorer, it’s a mess. The Nav menu is just a stack of words, for one thing. But the far bigger deal is that the two righthand columns are dumped way to the bottom of the main column! I talked to Bluehost, but they think it’s a CSS coding issue. Can you help? Thanks!
Hi, Chris. I figured out that some little coding thing I’d done in my widgets was messing things up. All better now!
Chris – would you be good enough to take a glance at the Windermere website (http://windermere.urc.org.uk) and advise me whether the Thesis theme could be used to do the same work? You’ll see it’s currently built on a Revolution template, using WP as a CMS, but I’m no code jock and the customisability of Thesis is incredibly appealing! So, if I’ll be able to use it, I want to buy the Developer pack ad use the theme differently on different sites. The question is, how easy is it to use for a site (as opposed to a super-blog) without a lot of coding know-how?
Thanks in anticipation.
Lawrence — Your question is astoundingly open-ended, simply because “easy” hinges on how you want your site to appear. If you want to run a Thesis-based site exactly like your Revolution-based site, then you’re probably going to end up frustrated. As of version 1.1, Thesis doesn’t allow you to set up a “featured” post area without adding some code, so that could be a potential sticking point for you.
On the other hand, you can make use of the tools that Thesis does offer – like the multimedia box, for instance – to accomplish similar things in a different way. It really all depends on your publishing needs and your goals for the site, you know?
Chris,
Just bought Thesis. It’s beautiful, no doubt about it. However, I never learned to do CSS, and am totally confused by directions to change it. I’d love to customize the colors of the tabs for my pages, for example, and have seen beautiful tabs and color on your web site for various categories, like “Improve Your Blog” and “The Latest Articles”
Where specifically can I find help learning to do THAT?
best wishes,
Rick
Dr. K — The changes you’ve inquired about are all achieved through a combination of graphics (made via Photoshop, GIMP, or a comparable program) and CSS. Essentially, you need to create an image and then insert it via the
backgroundCSS property.At this time, teaching Photoshop and CSS goes beyond the realm of what I’m able to handle, but you can definitely find out more information on this topic if you ask around the forums. This is a pretty standard procedure for folks involved in Web design, so I think you’ll be able to find some answers now that you know what to ask for.
On the showcase page, the link to this site repeatedly produces a Server not found message. I realize this may be a temporary glitch, but figured you should know.
I purchased Thesis, via PayPal, about two days ago and still have not received an e-mail giving me permission to upload your theme to our server. What gives?
No sooner had I downloaded the dev. version of Thesis than up pops a client and this is the perfect solution. I plan to rip it so that it doesn’t look like Thesis at first blush, but I’ll do you proud. I had the client look over the Thesis “About” page and he’s sold. I’ll do you proud, don’t worry!
(Just sad that I don’t even have time to play with my new toy yet!)
Maybe I’m overthinking this, but when you say you cannot sell the Thesis theme or any derivative thereof, I hope you don’t mean I cannot charge my client for designing his site using it? Taken literally,
could mean exactly that. Please clarify this for me. Thx.
Some days I feel really smart. Some days I feel really lame. This is one of those latter days……….
I do not understand what the custom CSS is supposed to look like.
I know how to find the CSS for the theme and I see quite clearly, the warning to “not make any changes to this file”
But, I’m clueless as to where my custom CSS file is and how to use it.
I’ve downloaded what I thought was a zip file with it in it, when I click on what I think is the CSS page, it opens up Notepad and all I see is some text across the top of the page.
I do not see anything that looks like a complete file.
Am I missing something? Am I really that stupid?
Joni — That just means you can’t go out, pretend you’re DIYthemes, and sell any modifications of Thesis.
Magnolia — Your
custom.cssfile is located in your/thesis/customfolder. At this time, you cannot edit this file from within WordPress; you must use an external text editing program (use Notepad++ if you’re on Windows) to edit this file, and you need an FTP client to upload the edited file to your server.Okay. I found it. I use Bluehost for my blog, so I think I’ve got the FTP client factor covered? (not sure what FTP client is exactly?)
Here’s where I’m befuddled………when I open the custom file, I see one long string of text. It looks nothing like the CSS style sheet in the theme customization area.
So, what exactly am I customizing?
Am I supposed to be adding the code to this file that has the long, continuous line of text and then uploading back to Bluehost?
And if that is the case, does the Thesis theme simply utitlize that file as long as I have the box checked that says Custom CSS?
Hoping I’m clear.
You should check out the forums.
They’ll be able to help you on all sorts of questions like that.
Comments on this entry are closed.