How to Create a Custom Single Post Template in Newspaper Theme

By default, Newspaper theme offers thirteen different single post templates. They are not customizable (unless you have both CSS and PHP knowledge). If you really want to customize the single post template of your Newspaper theme, you can create a custom single post template. Creating a custom single post template allows you to control everything. From the typography of the text content, featured image size, post meta elements, and so on. Newspaper theme comes with a Cloud Templates feature that allows you to create a custom single post template without coding. You can create the custom single post template using tagDiv Composer, the default page builder of Newspaper theme.

You can then apply the custom single post template you have created to the entire website or specific categories. You can also use the custom template you have created on individual posts.

How to create a custom single post template in Newspaper theme

Before getting started, make sure you have activated the tagDiv Cloud Library plugin. If you haven’t done so, go to the Newspaper -> Plugins to activate the plugin.

Once you are ready, go to Cloud Templates -> All Templates. Click the Add New button on the top side to create a new template.

The templates library will appear once you clicked the Add New button above. Go to the Single tab and select the single post template you like.

Click the CREATE TEMPLATE button to import the template you selected to the tagDiv Composer front-end editor.

Once the template is loaded to the tagDiv Composer front-end editor, you can start customizing it. Each template consists of varied shortcodes (design elements). Here are some elements you might want to customize:

• Featured image

To customize the feature image, find the Single Post Feature Image or Single Post Bg Featured Image shortcode and click Element to turn the shortcode into an editing mode then go to the left panel to customize it.

On the General tab, you can set the image size, image height, overlay color and so on. On the Style tab, you can set the image effects if you want. On the Css tab, you can set the margins, paddings, border color, border radius, and so on.

• Post title

To customize the post title, find the Post Title shortcode and click Element to turn it into an editing mode and go to the left panel to customize it.

To change the font size, font style, font family, and text color, you can go to the STYLE block under the General tab. You can read this post to learn more about how to customize the text in tagDiv Composer.

Go to the Css tab to set the margins and paddings.

• Post content

To customize the post content, find the Post Content shortcode and click Element to turn it the shortcode into an editing mode.

On the General tab, you can set the content width and image align.

To customize the content body (text), you can go to the Style tab. You can set the text color on the Post content color option, the headings colors on the H1-6 color option, the link color on the Links color option, the blockquote color on the Default blockquote color option, and the image caption text color on the Image caption text color option.

While to customize the typography (font size, font family, font style), you can go to the block on the bottom side. There are eleven elements you can customize their typography of: post content, H1 – H6, lists, blockquote, image caption, pagination text.

If you want to add an ad to the content body, you can go to the Ads tab. Paste the ad code to the area you want the ad to appear. To display ad in a certain paragraph, enter your preferred paragraph on the Par field.

You can go to the Css tab to set the margins and paddings.

To make it easy for you to identify your template later, you can rename it. To do so, click anywhere outside the canvas area and click EDIT.

Once you are done customizing the template, click the floppy disk icon to save the changes and click the X icon to exit the tagDiv Composer front-end editor.

If you prefer to create the custom single post template from scratch, you can simply clean up the canvas area and add the shortcodes yourself. Here are the shortcodes you can use when creating a custom single post template with tagDiv Composer.

Applying the template

As we mentioned at the beginning, you can apply the custom single post template you have created to the entire website, certain categories or individual posts.

Applying the custom single post template to the entire website

Go to Newspaper -> Theme panel. On the POST SETTINGS block, click the Default post template (site wide) option and select the template you have just created. Click the SAVE CHANGES button.

Applying the custom single post template to a certain category

Go to Newspaper -> Theme panel. Open the CATEGORIES block and scroll down to the Per category settings section (bottom-most). Open a category you want to apply the template to and click the dropdown on the POST CLOUD LIBRARY TEMPLATE option and select the custom single post template you have just created. Click the SAVE CHANGES button.

Applying the custom single post template to individual posts

In addition to applying the custom single post template you have just created to the existing articles via Newspaper theme panel, you can also apply it to new articles you want to create. To do so, just write a new article just like usual using Gutenberg editor. Before you click the Preview or Publish button, select a custom single post template beneath the text editor area.

The verdict

The Cloud Templates feature of Newspaper theme is pretty cool since it offers limitless options to customize your theme. In addition to creating a custom a custom single post template, this feature also allows you to create a custom header, custom footer, custom category page, and custom 404 page. No coding skill is required since the customization process is done via tagDiv Composer front-end editor.