How to Write CSS for a Thumbnail Image in WordPress
- 1). Log on to your WordPress site and click on "Appearance," then "Editor."
- 2). Select "Stylesheet" from the list on the right.
- 3). Add the CSS for your thumbnail using the online editor. For example, if you wish to align the thumbnail image to the left and display a solid black color for it, you can add this code:
img.alignleft {
float: left;
border: 1px solid #000;
} - 4). Click on "Update File."
- 5). Select the template where you have "the_post_thumbnail" code. If it is located within a WordPress page, select the "Page" template from the list of templates on the right.
- 6). Edit the code to apply the style you specified for your thumbnail. The following code displays the thumbnail using your site's default thumbnail size, with the style you defined in your style template:
<?php the_post_thumbnail('thumbnail', array('class' => 'alignleft')); ?> - 7). Update your template file to apply the changes.
