News Shortcode

Last Updated on

News shortcode is one of the Jupiter shortcodes that provides a list of news in a grid style from News post type. There are some options to fine tune the news loop.

In this article, we’ll explain about configuring News shortcode.

To see the News shortcode in action, you may check the demo page.

News shortcode - demo

In this article


Creating News Posts

Before displaying the news, some posts should be created to be used in the news shortcode.

To create a news post:

1
From the WordPress left menu, go to News > Add New.
2
Enter a title, fill out the necessary information and pick a post style.
3
Click on Publish.

Displaying News Shortcode

To add the shortcode:

1
Add a new page or edit an existing page.
2
From Visual Composer screen, click + button.

News shortcode - visual composer screen

3
In Add Element pop-up screen, search for News and click on it to be added to the page.

News shortcode - add element

4
When the shortcode is added, a new pop-up screen called News Settings opens. It gives you the ability to configure the shortcode settings.

News shortcode - News settings

5
Click Save Changes and publish or update the page to check the result.

Configuring News Settings

After you added the News shortcode, a pop up window will appear where you can set options for this shortcode. Below is the detailed description of each option for News shortcode.

Showing Specific Posts

There are 3 settings in Portfolio Carousel Settings pop-up which allow you to show the posts based on specific categories, IDs or authors. Type the name of category, post or author to add them in the fields.

SettingDescription
Select Specific Categories Determines categories of news posts. Posts from the selected categories will be only displayed.
Select Specific Posts Determines specific news posts. The selected posts will be only displayed.
Select Specific Authors Determines authors of news posts. Posts from the selected authors will be only displayed.

Configuring Posts Number

Setting Description
How Many Posts?  Sets the limit for the News Posts you want to have in the front end of the website. If this option is set to -1 it means you do not want to have any limitation regarding the news posts count.
Offset  Sets the number of post to displace or pass over, it means based on your order of the loop, this number will define how many posts to pass over and start from the nth number of the offset.

Configuring News Styling

Only one option here that allows to style new shortcode. You can set image height value.

SettingDescription
Image Height Sets the Image Height which will be suitable for your design.

Setting Pagination

Two options are available for pagination settings:

Setting Description
Show Pagination? Enables/disables the pagination functionality for News loop.
Pagination Style Select which pagination style you would like to use on this loop. Available options are: Classic Pagination Navigation, Load More Button, Load More on Page Scroll.

Altering the Images Sorting

There are 2 settings in News Settings pop-up which allow you to alter the posts sorting. By default, Order and Orderby settings are set to Ascending and Date therefore it sorts the older posts ahead of newer posts.

SettingDescription
Order  Sets the ascending or descending order of the Orderby parameter.
Orderby  Sorts the posts based on the selected parameter (date, menu order, title, …).
x
Note: To learn more about these settings, read Configuring shortcode’s sorting settings article.

 Adding an Extra Class Name

Extra Class Name field in the setting pop-up allows you to add an extra class name to the shortcode. It’s useful when you need to target the shortcode in a style sheet or JavaScript file.

You can read Adding custom CSS class to a shortcode article for further explanation.

Was this helpful?
Previous Article:
Next Article:

Can't find what you're looking for?

Open New Ticket