Single post and Blog archive customization

Hi there,

I have been editing custom CSS and some .php files (single.php + content.php) to customize both the blog archive and single post pages of a website for a client. I created a custom /blog page using your Blog element in Elementor, choosing the ‘Meta on design’ under the ‘Blog design’ dropdown.

I created 2 instances of the Blog element to mirror the client’s design, the first being to showcase the latest/featured post, the 2nd one to show a grid of Recent articles/posts (hidden for now, as the client only has 1 real post).

I also used the advice from another forum post (https://xtemos.com/forums/topic/change-single-post-related-posts-design/) to add some PHP to the content.php file to add an HTML block to the single post template.

I tried altering the single.php code (after backing up original) to style the Related posts section on the single post page to look like what I had in the above /blog page, the archive grid. Namely lines 86 & 88

‘blog_carousel_design’ => ‘meta-image’ === $design ? $design : ‘masonry’, **changed to => ‘meta-image’**

(I got the idea from this forum post – https://xtemos.com/forums/topic/change-single-post-related-posts-design/)

‘slides_per_view’ => 2, **changed to 3**

My problem is, while I seemed to be making progress, it would get reversed/lost if I updated settings via Theme settings > Blog in WordPress backend.

The most noticeable thing I cannot get back is the related posts carousel has disappeared

I’ve since restored the original single.php file. But the Related posts carousel is still missing.

I’d appreciate your help with this so I can handover the website to my client and train them on using the blog.

I’d also like some advice on how to make the page content Full width like the rest of the site.

Hello,

The Related posts show based on the tags – https://prnt.sc/xwwIHuwAS2MP so define similar tags for each post and recheck the issue – https://prnt.sc/rCAPwDAeGanD

Let me know the result

Kind Regards

Hi,

I see it works if I add a tag. I don’t really need tags (seems like categories is enough), but I created a tag called “blog” and hid the display property so they won’t show on the single post.

I still need your help with making the single post content display full width. I have changed Theme Settings > General> Layout to full width and removed the sidebar (please see attached screenshot). I have also tried adding CSS but cannot find the right class it seems. Please advise how to achieve something in line with the other pages of the site.

Attachments:

You must be logged in to view attached files.

Hello,

Navigate to Theme Settings -> Settings Presets -> create a preset with such a condition -> https://prnt.sc/wr6Jnz5iFs_x then in its settings define the “Content full width” here – https://prnt.sc/1CvO0pOESwQB

Then check how it works and let me know.

Kind Regards

I tried creating the preset with those settings. Didn’t change the layout of my published post.

Hi,

We checked your preset and noticed that Site Width is set to Full Width, which in this case does not affect the content width since this is the default value for our theme.

To stretch the content to full width, you need to set Site Width to Content Full Width (screenshot https://monosnap.com/file/E0LL5TOTy26d9K33WlfBDYFXSqsPl1). We temporarily applied this setting for testing, and the content expanded accordingly (screenshot https://monosnap.com/file/kDoyK4WjzCUMakqvUQio8OKS46g3eg).

Kind Reagrds

[Author]

Posts