moving featured image to left

a1motorcare · Member · Apr 27, 2017 at 10:54 am
Copy link

Add topic to favorites
Hi guys,

Wondering if anyone can tell me how I can move the featured images (specifically on the ‘Services’ pages to the right and have the text on the left?

The blog I need help with is: (visible only to logged in users)
otpidusprime · Member · Apr 27, 2017 at 11:08 am
Copy link
Hello @a1motorcare,
You will need to customize the CSS to be able to do that.

However, Customizing CSS is a feature which comes with the paid WordPress.COM Premium and Business plans.

Read more about it here: https://en.support.wordpress.com/custom-design/editing-css/

Let us know if you are on any one of the above mentioned plans, so that we can provide you the CSS code.

Thanks! 🙂
a1motorcare · Member · Apr 27, 2017 at 12:05 pm
Copy link
Hi Otpidusprime.

Thanks for you’re reply.

I have a paid wordpress account and can customise CSS.

Any idea how I can do this by customising the CSS?

Thanks!
otpidusprime · Member · Apr 27, 2017 at 12:11 pm
Copy link
Okay, then try this CSS code:
```
.attachment-full {
    float: left;
    width: 50%;
    margin-right: 30px;
    height: auto;
}
```
Copy and paste it into the CSS editor.

To access the CSS editor:
1. Go to My Site(s) → Customize(Beside the Themes option) or just click here: https://wordpress.com/customize/. This will open the site Customizer.
2. On the sidebar of the Customizer. Click CSS tab.
3. You will find your CSS Editor there.
4. After copying and pasting the code, click Publish & Save.

Hope this helps 🙂
a1motorcare · Member · Apr 27, 2017 at 12:17 pm
Copy link
Thanks for this. Worked great.

The only thing is that it’s applied the rule to all pages. Is it possible to select specific pages to apply the rule to?

Thanks again!
a1motorcare · Member · Apr 27, 2017 at 12:19 pm
Copy link
It’s also moved the site logo in the header to the right and made it smaller.

Is there a way to prevent this?

Thanks
otpidusprime · Member · Apr 27, 2017 at 1:27 pm
Copy link
The only thing is that it’s applied the rule to all pages. Is it possible to select specific pages to apply the rule to?

1. home page only:
```
.page-id-42 .entry-thumb {
    float: right;
    width: 50%;
    margin-left: 30px;
    margin-top: 30px;
    height: auto;
}
```
2. about page only:
```
.page-id-116 .entry-thumb {
    float: right;
    width: 50%;
    margin-left: 30px;
    margin-top: 30px;
    height: auto;
}
```
3. services page only:
```
.page-id-118 .entry-thumb {
    float: right;
    width: 50%;
    margin-left: 30px;
    margin-top: 30px;
    height: auto;
}
```
In other words, look for the page-id class under the body tag for every page.

It’s also moved the site logo in the header to the right and made it smaller.

Can you provide a screen shot for this?
a1motorcare · Member · Apr 27, 2017 at 2:39 pm
Copy link
That’s fixed it. Brilliant! Thanks a lot!

!!
otpidusprime · Member · Apr 27, 2017 at 3:19 pm
Copy link
@a1motorcare you’re welcome 😇

No items found.