How to Change the Blog Style Setting

Support
#1

Kindly Follow the Images :
you can see that in first pictures there are border arround the two pictures - and second pictures is the blog post, there are two problem with the blog post.

  1. the image is attached with the header and there is no proper gap.
  2. the image have not the border. the the image should be in border for every single blog post just like the first image border style.

i hope you got the point.

#2

Hi,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation.

Thank you.

#3

follow the link
https://www.edcons.edu.pk/issues-considered-achieve-co-operation-co-ordination-employers-share-workplace/

#4

Hi,

To add space and border, you can add the code below in Theme Options > CSS

.single-post .entry-featured {
    margin-top: 20px;
    margin-right: 0;
    border: 1px solid #eee;
    padding: 10px;
}

Hope that helps.

#5

follow the image
its working fine, just add the space or gap between the header and border from the upper side

#6

Hi there,

Please kindly add the code below to X > Launch > Options > CSS:

.single-post .x-main.left .hentry .entry-featured {
    margin-top: 0;
}
#7

follow the image
its fine now - now kindly change the colour of of the widget area to white - same colour to post and widget area as you can see two colour separating each other?

#8

Hi there,

Please kindly consider that this is part of customization and it is outside of our support scope we did our best to help you out with proper CSS code but we will not be able to give you more and you need to make sure you learn the CSS basics to be able to do the customization yourself.

For the latest request kindly add the CSS code below:

.single .x-root .site {
    background-color: white;
}

To learn more about CSS and tips and tricks of the styling I suggest that you get started here:

https://www.w3schools.com/css/

Also, to be able to detect correct selectors for the CSS I used the Google Chrome browser developer toolbar which you can find a good tutorial about here:

Thank you for your understanding.

#9

this is my blog page - here is also the colour how to remove that -

#10

ohhh thank you so much dear - i regard your effort - actually i don’t know the CSS but i will request you to please consider my every request - i am pro user of X theme - and i want to enjoy the theme, its awsome theme - i hope you understand my consideration.
i got your video - thank for the sharing - i will check it and try to learn CSS, :slight_smile:

#11

Hi there,

I tried to isolate the code only for the single blog posts as the original question was about that. But you can have it for the whole website if you want, simply change the code to:

.x-root .site {
    background-color: white;
}

But if you do not want this code to work sitewide and only in the single blog posts and blog listing page you need to change the code to this:

.blog .x-root .site, . single .x-root .site {
    background-color: white;
}

By the way, if you have additional questions kindly open up a separate thread for each one, that will help us to focus on each question separately and with greater care.

Thank you for your understanding.

#12

Thank You So Much - Worked Fine - :slight_smile:

#13

You’re welcome.

#14

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.