Add News as “Posts”

How to Add Posts
  1. Visit your dashboard on ‘My Sites’.
  2. Click on “Posts” option on the left hand side.
  3. Click on the “Add new post” button from the left side pane.
  4. Give your post a title by typing it in the box located on the top saying “Add title“.
  5. Start typing the text of your post or click on the + block inserter icon to add other blocks/ images for your posts.
Way to add in New Posts

Types of News Views

The different types of views which can be used to display the news are:

  • Grid View
  • Grid View Using “Query Loop”
  • List View
  • Carousel View
Grid View

As the name suggests Grid View helps to present your content in a two-dimensional scrolling grid, arranged in rows and columns.

Steps to Display News Grid View

To add a new Grid block, click the + block inserter button and search for “grid”. Click it to add the block to the post or page.

After adding the Grid View, your posts will automatically be displayed in the Grid format.


How to add Grid View
Way to customize Grid View

You can customize grid block by clicking on the Grid Block by choosing various options.
– Customization Options: Number of columns , background color, and text color

Layout

You can change the layout of the Grid by click on the “Columns” option which allows you to select number of posts/news you want to display in one column.

Styles


Background Color: Helps you to customize the color of the post’s background.
Text Color: Allows you to change the color of the text.


Ways to Customize Grid View

Sample Grid View


List View

List View helps you to display your news in the format of list which is easier for user to view.

Steps to Display News List View

To add a new List view, click the + block inserter button and search for “Latest posts”. Click it to add the block to the post or page.

After adding the ‘Latest Posts’ option, your posts will automatically be displayed.

There click on the ‘Latest Posts’ block and navigate to the toolbar bar displayed automatically on the top of the block.

Select ‘List View’ option a dot with three lines and your posts will be displayed in list view format.

How to Add List View

Ways to Customize List View

You can customize List view by clicking on the list news block and there will be various options available for customization
– Customization Options: , Post Content, Post Meta (Choose to display author Name, Date Published). You can also display the Featured image of your post by selecting “Display featured Image” option.

Layout

You can select number posts you want to display and the number of words to be displayed in your news by clicking “Number of Items and Max number of words.

Sorting and Filtering

Allows you to sort or filter your news
Clicking on the Order By dropdown menu you get the option to sort your news from:
1. By Date – Oldest to Newest, Newest to Oldest
2. In Alphabetical Order- A->Z OR Z->A
Categories – This option allows you to select the different categories you want to display in your news.
Author This allows you to select and add the names of the authors you want to display for your news.

Styles


Background Color: Helps you to customize the color of the posts background.
Text Color: Allows you to change the color of the tex.

Ways to customize List View


Sample News in List View

Query Loop

 Query Loop helps to display news in various flexible formats. This block provides a user with a great flexibility to display the news using various layouts. You can select from custom layout or can create another layout of your choice.

Steps to Display News with Query Loop

To add a new Query Loop block, click the + Block Inserter icon and search for “query”.
Click it to add the block to the news post.
Clicking query loop will give you options to choose either from preset patterns or you can also click on Start Blank and create your own patterns.
After clicking on Start Blank it will display basic variation options which you can select the information you want to display in your news.
– Title & Date
– Title & Excerpt
– Title, Date, & Excerpt
– Image, Date, & Title

Query Loop with Preset Patterns

Query Loop with Start Blank option

Ways to Customize Query Loop

Click on the block, a toolbar with options will appear automatically on the top of the block:

Display settings includes:

Items per page Choose how many posts are shown on the page. Displaying more than 100 posts at once could significantly slow down the page’s loading time, so this is limited to a maximum of 100 posts per page.
Offset: Begin from the first post (0) or skip the first X number of posts.
Max page to show: When you use pagination this option tells you the maximum number of pages that can be viewed in total.

For changing the layout click o the block and then select customization pane on the right side.

Settings

Inherit query from template option, your content will be displayed using the default options. Turn it off to customize:
Post type: Choose to display posts, pages, testimonials, portfolio projects, or other custom post types that may be added via plugins
Order by: Order your content alphabetically or in chronological order as per your preference.
Sticky posts: You can select if you wish if you want or not to show stick posts.
Enhanced pagination: You can keep this On to show pagination and navigation between different pages of news pages.

Layout

Inner blocks use content width-This is used to adjust the container width.You can select if you want to keep it on/off
Off: Blocks inside the Query Loop block will fill the container’s width automatically.
On: Customize the width and alignment for blocks inside the block. Set a custom value for the regular width of the content and another value for blocks set to Wide width. You can also justify the content inside the Query Loop to the page’s left, center, or right.

Padding-Allows you to select the amount of space you want to add between two news.
Recommendation– Use M size as it fits all the news perfectly.

Justification
Allows you to justify you news ite,s
– In center
– In left side
– In right side
– Add space between you items

Styles

There are various styles you can choose from:
When you click on the featured image of your news
You can customize the size, colors and dimensions of your post

Filters

Filters allows you to select the content you want to display in the specific field.
Turn off the Inherit query from template setting to access the filters options.
Click on the three dots icon and select whichever filters you wish to use:
– Taxonomies
– Tags
– Categories
– Authors
– Keyword

This is a query loop view showing all the customization options available and the ways to implement them


Sample News using Query Loop View

  • News

    Add News as “Posts” Types of News Views The different types of views which can be used to display the news are:…Continue Reading News

    Read More

Carousel View

Carousel View is used to display the news in the style of sliders which helps a person to navigate the news easily and fast.

Steps to Add Carousel View

To add a Carousel block, click on the + block inserter icon and search for the  Carousel Posts block . Click to add the block to a news.

Ways to Customize Carousel View

The Post Carousel block has the following settings:

Display Settings

It allows you to choose the news you want to display according to your choice.

  • Choose Specific Posts: Allows you to select the exact news which you want to display in the slider.
  • Number of items: Helps you to choose the number of news items you want to display in the slider. Max no. of 100 items.
  • Authors: Allows you select the specific authors’ news you want to display
  • Categories: Allows yopu to select which all categories of news you want to display
  • Tags: Show posts with a specific tags only.

Slideshow Settings

  • Slide Aspect Ratio: Helps to adjust ratio between the width and height of the images in the slider.
  • Image Fit: Determines if the image will crop to fit, or stretch to fit, the available area.
  • Hide Controls: This helps you to control if you want to display the controls which are used to move the slider.
  • Autoplay: You can choose this if you want to autoplay the slider.
  • Number of slides to show at once: Choose the number of news you want to display in single slide (Max -4)

Meta Settings

Here, you can choose which information appears with your content in the news:

  • Show Title: Display the post title.
  • Show Date: If you want or not to display the date.
  • Show Category: Controls whether the category will be displayed or not.
  • Show Author: Controls whether the author’s name will be displayed.
  • Show Author Avatar: Controls whether the author’s profile photo if uploaded will be displayed or not.

Sample Post Carousel News View

Post For UA (Sample)
Sample Post 2
This is another sample view of a News Item.
Sample News
This is a sample view of a News Item.
Sample Posts
Lorem Ipsum text….