Centering images

Latest Reply from Dave at 2014-08-25 03:43:31 Solution
I have a number of SMThemes installed for a client. With about four or five of them, my client is unable to center an image. I have tried and tried and tried and couldn't get it to work, either. I even hard-coded in an image to align to the center and when it was published, the image went to the left regardless of what I did. Since John refuses to help with design elements, I am once again left with the impression that this is a design FLAW in the theme coding. Any assistance would be appreciated.

TK Harrison
Hi there,

Could you give us URL of a website where the problem is, or name of a theme?
www.livingprocessedfree.com

www.redkettlecook.com

www.crafters-corner.com

www.thefamilysqueeze.com

www.life-longlearning.com
oops, sorry - theme names next to domain names:

www.livingprocessedfree.com - Penthouse

www.redkettlecook.com - HomeDish

www.crafters-corner.com - Queen

www.thefamilysqueeze.com - Milady

www.life-longlearning.com - MuscleCars
Hi!
Which images do you want to center align?
It doesn't matter - none of the photos my client puts in center. I need to know how to fix this for her.
Hi!
It depends on the image you want to center align. If it is the featured image you need to set the option "Loop image position" to center. If you want to align all the other images in your posts/pages you need to read the following instruction:
http://codex.wordpress.org/Inserting_Images_into_Posts_and_Pages
I know for a fact that just centering the image does not work - my client has tried it and I tried it - even going in and altering the HTML coding before publishing and the image STILL wouldn't center.

She does not want to center all images so don't want to change the coding on all of the pages.

We just want the theme to work as it's supposed to!

Tammy
Probably, this is caused by the work of your third-party plugins. They can use their own styles and override your custom css.
This client has well over a dozen sites on my server using SMThemes and the sites mentioned above are the ONLY sites that have the centering problem - and ALL of the sites have the exact same plugins. I disagree with you on blaming something other than the theme code.
Please, specify the image you want to center align and the page where it is placed.
ANY image on any of the sites listed above will not center, so you can look at any of the sites to see if you can figure out how to center it.
!)Obviously, you set the right alignment on home page of www.livingprocessedfree.com. There is the class:
"class="rg_i alignright"
that means you set the right alignment for this image.
2)As I can see you have set the left alignment for the image
src="https://images-na.ssl-images-amazon.com/images/P/1449430082.01._SL160_PIsitb-sticker-arrow-dp,TopRight,12,-18_PE33_OU01_SCLZZZZZZZ_V339468105_.jpg"
on http://redkettlecook.com/.

All that means you just have to use the instruction:
http://codex.wordpress.org/Inserting_Images_into_Posts_and_Pages
and set the alignment for your media file. If you still can't do it, give me an access to one of your websites and I will set the image alignment.
Where are you seeing "class="rg_i alignright" on LivingProcessedfree.com? I have searched the main CSS and an not finding it (nor did I find it under the loop, functions, main page template, etc.).
And yes, most of the images on all of these sites are to be left justified (including the one you selected). John sent me the code to do this:

.post-body img {margin-left: 10px;
margin-right: 100px;}

But, there are times my client wants to center an image and she's unable to do so.
Hi!
This class is set for the image in the post "EVERYDAY HABITS THAT AGE YOUR SKIN". Please, give your client the instruction I gave you. Because it is the only way to center the image on page in WordPress. If she doesn't know how to set the alignment for the featured image she has to:
1) open the page Theme Settings --> Layout;
2) set the appropriate "Loop image position";
3) save changes by clicking on a check mark on the right.
This does NOT center the image. All it does is center the content - the image WILL NOT center - even when I go into the properties of it and tell it to center the image. grrrrr
You may have checked your most recent comment off as a solution but it is hogwash. It STILL does NOT center the images!!!
Sorry, it was a misprint. Of course, you have to set "Loop image position". Besides, this option concerns only alignment for the images that are set as a featured image for posts/page. It won't work for all your images in post. The image alignment for all the others media files you have to set when editing the post/page by clicking on the image.
Nope, still doesn't work. The "Loop Image Position" was already turned on in the theme. Centering the image through both the media file as well as the image editing doesn't change the image to centered. It will go left and it will go right but it will NOT center.
I can't understand what are you talking about. I explained you how to align the featured image and the other media you insert.
As I can see it works for all the other customers that buy our themes. Moreover, it works even on your websites that are listed above in the second post.
Lets analyse your clients website.
1) the first website: http://livingprocessedfree.com/.
All the products(books images) are aligned left. It is not the featured images, but product images. Probably, you have used some plugins for this. If yes - we can't guarantee the proper work of the theme as plugins can include css files. But the alignment works.
2) www.redkettlecook.com - the same thing. Image products are aligned left by you.
3) http://crafters-corner.com/ The first post contains the image with attribute
src="http://www.playtimeeducationaltoys.com/wp-content/uploads/2012/04/toddler-crafts-playtime-educational-toys.jpg"
Hope, you know what it is. This image is aligned right and even adjusted to your needs using advanced setting for images lice "CSS styles", because the code:
style="margin-top: 102px;"
is inserted.
As you can see your clients are able to customize their websites, image position and even more.
I don't know why you don't align the images to center, but all the code is provided to do this. It is located in the css/index.css file:
.featured_image.alignleft{ margin-right:20px; margin-bottom:10px;  }
.featured_image.alignright{ margin-left:20px; margin-bottom:10px; }
.featured_image.aligncenter{ margin-bottom:10px; }
.alignleft { float:left; }
.aligncenter { margin:0 auto; display:block;}
.alignright { float:right; }

All the types of alignment is provided.

Leave a reply

Add codeAdd image