This topic has 12 replies, 2 voices, and was last updated 1 years ago ago by Tony Rodriguez
Hi,
I am facing issue with spacing between blog post and header. Blog post is overlapping with the site logo now. I attached the site details in private area, thanks!
Hello, @vidomarketing,
Thank you for contacting us and for using XStore.
We are pleased to inform you that your issue has been resolved. We kindly request you revisit your site after clearing your browser cache.
We have deactivated the Header Overlap & Transparent option located under Xstore > Theme Options > Header Builder > Multiple Headers > Edit post header and published it. This action has successfully resolved your issue.
Please refer to the attached image for further clarification.
Best Regards,
8Theme’s Team
Thanks!
Btw how do i change the blog post width? or make it full screen like the pages?
Hello, @vidomarketing,
Should you desire to adjust your blog single post to full-screen width, kindly follow these steps: Navigate to XStore > Theme Options > Blog > Single Post. Here, you can choose the ‘Layout Blog Single Post’ option. After making your selection, please ensure to publish it.
For your convenience, we have attached an image for reference.
https://postimg.cc/K3M2pw1F
Best Regards,
8Theme’s Team
Hi thanks for the reply, the client actually want to style it to full screen with margin left and right @ 30px only.
I tried to add css but it doesnt work for me, maybe my css is wrong, can u help me by giving me the correct css?
Hello, @vidomarketing,
To accomplish your desired outcome, kindly follow the steps below:
1. Go to Xstore.
2. Click on Theme Options.
3. Select Theme Custom CSS.
4. Choose Global CSS.
After completing these steps, please clear your browser cache and revisit your site.
Please ensure that the following code is present:
@media(min-width:1200px){
.single-post .page-wrapper .container {
margin-left: 30px !important;
margin-right: 30px !important;
max-width: 96% !important;
}
}
The final result should resemble the image provided in this link: https://postimg.cc/tYQt4Ndr
Best Regards,
8Theme’s Team
Thanks it works!!
One last request, how do i edit the blog title font size? I check the typography under headings, it only has font family and variant, i dont see any option to change the heading font size?
Can u please help?
Hello, @vidomarketing,
We kindly request you to provide the URL of the page and a screenshot of the title whose size you wish to alter. This will enable us to examine the issue and offer a suitable solution.
Please upload your screenshot to the following site: https://postimages.org/ and share the URL with us here.
Best Regards,
8Theme’s Team
hi i attached the blog urls in the private area, thanks!
Hello, @vidomarketing,
We appreciate your request for the URL of the page.
To modify the font-size of your blog title, kindly follow the steps below:
1. Navigate to Xstore > Theme Options > Theme Custom CSS > Global CSS.
2. Copy and paste the following CSS code:
.blog-post .post-heading h2 a {
font-size: 15px !important;
}
Please note that you can adjust the ‘font-size’ value to suit your preference.
We trust that this will resolve your issue.
Best Regards,
8Theme’s Team.
hi, how do i adjust the single blog post margin on mobile version to 5px on margin left and right?
Hello, @vidomarketing,
Upon reviewing your single post page, we noticed that you have already set a 40px padding to the left and right of your content for the desktop version. However, this setting also applies to the mobile version. Therefore, if you simply set the margin to 5px on the left and right for the mobile version, there will be a 25px gap on both sides.
To rectify this, we have removed the padding from the left and right on the mobile version of the single post page. This was achieved by adding the Custom CSS code provided below to your site under Xstore >> Theme Options >> Theme Custom CSS >> Global CSS: https://imgur.com/NSGYYny
Here is how your site appears on the mobile version to us: https://postimg.cc/34hWwpRN
@media(max-width: 767px){
.single-post section.elementor-section.elementor-top-section {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
Best Regards,
8Theme’s Team
You must be logged in to reply to this topic.Log in/Sign up