[prev_post]

The shortcode is designed to display a link to the previous post.

Product

Launchpad Platform

Shortcode Attributes

  1. label – The text label displayed for the previous post link.
    • Default: Previous.
    • Options: Any text value.
  2. taxonomy – Specifies the taxonomy to filter the previous post.
    • Options: category, post_tag, or custom taxonomy.
  3. data – Used to control what data show. Allow multiple values.
    • Options: title, image, date. Use commas to separate.
  4. layout – Specifies the layout style for the previous post link.
    • Default: 1.
    • Options:
      • 1 –  image above content;
      • 2 – image left content;
      • 3 – image right content.

Example Usage

Example 1

[prev_post]

Results

<span class="hic-post-meta-nav prev-nav layout-1">
    <a href="https://example.om/prev-post/" rel="prev">
        <span class="nav-box">
            <span class="nav-content">
                <span class="nav-label">Previous</span>
            </span>
        </span>
    </a>
</span>
This example will display a simple “Previous” link to the previous post.
The shortcode only works on single post pages (is_single()). If used on other pages, it will return an empty string.

Example 2

[prev_post label="Go Back" data="title"]

Results

<span class="hic-post-meta-nav prev-nav layout-1">
    <a href="https://example.om/prev-post/" rel="prev">
        <span class="nav-box">
            <span class="nav-content">
                <span class="nav-label">Go Back</span>
                <span class="hic-title"><h3>The top Gold Coast suburbs to invest in property</h3></span>
            </span>
        </span>
    </a>
</span>
This example will display a link with the label “Go Back” and the title of the previous post.

Example 3

[prev_post data="image" layout="3"]

Results

<span class="hic-post-meta-nav prev-nav layout-3">
    <a href="https://example.om/prev-post/" rel="prev">
        <span class="nav-box">
            <span class="nav-image-container">
                <span class="hic-image" style="background-image: url(https://launch.test/wp-content/uploads/2023/06/image.jpg);"></span>
            </span>
            <span class="nav-content">
                <span class="nav-label">Previous</span>
            </span>
        </span>
    </a>
</span>
This example will display the previous post link with an image and use layout style 3.
If the data attribute includes "image", the shortcode will attempt to retrieve the featured image of the previous post. If no image is found, the image container will not be displayed.

Example 4

[prev_post taxonomy="category" data="title,image"]

Results

<span class="hic-post-meta-nav prev-nav layout-1">
    <a href="https://example.om/prev-post/" rel="prev">
        <span class="nav-box">
            <span class="nav-image-container">
                <span class="hic-image" style="background-image: url(https://launch.test/wp-content/uploads/2023/06/image.jpg);"></span>
            </span>
            <span class="nav-content">
                <span class="nav-label">Previous</span>
                <span class="hic-title"><h3>Title of the previous post</h3></span>
            </span>
        </span>
    </a>
</span>
This example will display the previous post link within the same category, including the title and image.
The taxonomy attribute allows you to filter the previous post by a specific taxonomy, such as a category or custom taxonomy.