# Sticky Posts

A Sticky Post is the post will be placed at the top of the front page of posts. This feature is only available for the built-in post type post and not for custom post types.

## How to stick a post

1.  Go to **Administration Screen \> Posts \> Add New** or **Edit**
2.  In the right side menu, Click Edit link of Visibility option in Publish group
3.  Click Stick this post to the front page option

<figure class="wp-block-image">
<img src="https://i0.wp.com/developer.wordpress.org/files/2017/01/sticked_post.jpg?resize=307%2C449&amp;ssl=1" class="wp-image-24975" data-recalc-dims="1" loading="lazy" decoding="async" srcset="https://i0.wp.com/developer.wordpress.org/files/2017/01/sticked_post.jpg?w=307&amp;ssl=1 307w, https://i0.wp.com/developer.wordpress.org/files/2017/01/sticked_post.jpg?resize=205%2C300&amp;ssl=1 205w" sizes="auto, (max-width: 307px) 100vw, 307px" width="307" height="449" />
</figure>

## Display Sticky Posts

### Show Sticky Posts

Display just the first sticky post. At least one post must be designated as a “sticky post” or else the loop will display all posts:

```
<?php
$sticky = get_option( 'sticky_posts' );
$query  = new WP_Query( 'p=' . $sticky[0] );
```

Display just the first sticky post, if none return the last post published:

```
<?php
$args  = array(
    'posts_per_page'      => 1,
    'post__in'            => get_option( 'sticky_posts' ),
    'ignore_sticky_posts' => 1,
);
$query = new WP_Query( $args );
```

Display just the first sticky post, if none return nothing:

```
<?php
$args   = array(
    'posts_per_page'      => 1,
    'post__in'            => get_option( 'sticky_posts' ),
    'ignore_sticky_posts' => 1,
);
$query  = new WP_Query( $args );
if ( isset( $sticky[0] ) ) {
    // Insert here your stuff...
}
```

### Don’t Show Sticky Posts

Exclude all sticky posts from the query:

```
<?php
$args  = array( 'post__not_in' => get_option( 'sticky_posts' ) );
$query = new WP_Query( $args );
```

Exclude sticky posts from a category. Return ALL posts within the category, but don’t show sticky posts at the top. The ‘sticky posts’ will still show in their natural position (e.g. by date):

```
<?php
$args  = array(
    'ignore_sticky_posts' => 1,
    'posts_per_page'      => 3,
    'cat'                 => 6,
);
$query = new WP_Query( $args );
```

Exclude sticky posts from a category. Return posts within the category, but exclude sticky posts completely, and adhere to paging rules:

```
<?php
$args  = array(
    'cat'                 => 3,
    'ignore_sticky_posts' => 1,
    'post__not_in'        => get_option( 'sticky_posts' ),
    'paged'               => get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1,
);
$query = new WP_Query( $args );
```

<div class="wp-block-wporg-notice is-info-notice">

<div class="wp-block-wporg-notice__icon">

</div>

<div class="wp-block-wporg-notice__content">

Use get_query_var( ‘page’ ) if you want this query to work in a Page template that you’ve set as your static front page.

</div>

</div>

```
<?php
/* Get all Sticky Posts */
$sticky = get_option( 'sticky_posts' );

/* Sort Sticky Posts, newest at the top */
rsort( $sticky );

/* Get top 5 Sticky Posts */
$sticky = array_slice( $sticky, 0, 5 );

/* Query Sticky Posts */
$query = new WP_Query( array(
    'post__in'            => $sticky,
    'ignore_sticky_posts' => 1,
) );
```

## Style Sticky Posts

To help theme authors perform simpler styling, the <a href="https://developer.wordpress.org/reference/functions/post_class/" rel="function">post_class()</a> function is used to add class=”…” to DIV, just add:

```
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
```

The <a href="https://developer.wordpress.org/reference/functions/post_class/" rel="function">post_class()</a> outputs the class=”whatever” piece for that div. This includes several different classes of value: post, hentry (for hAtom microformat pages), category-X (where X is the slug of every category the post is in), and tag-X (similar, but with tags). It also adds “sticky” for posts marked as Sticky Posts.

```
.sticky { color: red; }
```

<div class="wp-block-wporg-notice is-info-notice">

<div class="wp-block-wporg-notice__icon">

</div>

<div class="wp-block-wporg-notice__content">

The “sticky” class is only added for sticky posts on the first page of the home page (<a href="https://developer.wordpress.org/reference/functions/is_home/" rel="function">is_home()</a> is true and <a href="https://developer.wordpress.org/reference/functions/is_paged/" rel="function">is_paged()</a> is false)

</div>

</div>