- This topic has 35 replies, 4 voices, and was last updated 4 years, 5 months ago by
Elvin.
-
AuthorPosts
-
July 25, 2020 at 9:27 pm #1376427
Shami
The same old problem, which happened after using Tom’s code, has happened: The pagination on my archive pages has disappeared. The rest is fine.
Infinite scroll isn’t working.
My archive pages are only showing the default number of posts, which is five. After that, there seems no way to access older posts.
Also, it’s worth noting that there are more than 20 posts.
Note: Tom had provided the solution to me earlier for this exact problem. But since the PHP code David has provided is different, I guess, the solution would be different.
July 26, 2020 at 6:23 am #1376720David
StaffCustomer SupportTry changing this:
if ( ! $post ) {
to:
if ( ! $post || ! is_single() ) {
July 26, 2020 at 7:19 am #1376769Shami
It didn’t work.
July 26, 2020 at 7:47 am #1376806David
StaffCustomer SupportEdited above – try that.
July 26, 2020 at 7:53 am #1376928Shami
Still not working. I tried. The pagination doesn’t appear in the blog archive.
July 26, 2020 at 12:27 pm #1377185Tom
Lead DeveloperLead DeveloperCan you share the complete PHP function you’re using right now?
July 26, 2020 at 6:57 pm #1377370Shami
I’m using the Generatepress child theme.
Here is the full function.php code:
<?php /** * GeneratePress child theme functions and definitions. * * Add your custom PHP in this file. * Only edit this file if you have direct access to it on your server (to fix errors if they happen). */ //custom php function filter_single_post_navigation($output, $format, $link, $post){ if ( ! $post || ! is_single() ) { return ''; } $title = get_the_title($post); $url = get_permalink($post->ID); $container_class = 'previous'; $class = 'prev post-nav-button'; $rel = 'post-navigation prev'; $label = __( 'Previous Article:', 'generatepress' ); if('next_post_link' === current_filter()){ $container_class = 'next'; $class = 'next post-nav-button'; $rel = 'next'; $label = __( 'Next Article:', 'generatepress' ); } return "<div class='$container_class'><span class='label'>$label</span><a href='$url' rel='$rel'><span class='label'></span>$title</a></div>"; } add_filter( 'previous_post_link', 'filter_single_post_navigation', 10, 4); add_filter( 'next_post_link', 'filter_single_post_navigation', 10, 4); //for changing comment section title add_filter( 'generate_comment_form_title', function() { $comments_number = get_comments_number(); return sprintf( // WPCS: XSS OK. /* translators: 1: number of comments */ esc_html( _nx( 'Reader Comments (%1$s)', 'Reader Comments (%1$s)', $comments_number, 'comments title', 'generatepress' ) ), number_format_i18n( $comments_number ), get_the_title() ); } ); add_filter( 'generate_show_post_navigation', '__return_false' ); add_action( 'generate_before_comments_container', function() { if ( is_single() ) { the_post_navigation(); } } ); //custom php end function generatepress_child_enqueue_scripts() { if ( is_rtl() ) { wp_enqueue_style( 'generatepress-rtl', trailingslashit( get_template_directory_uri() ) . 'rtl.css' ); } } add_action( 'wp_enqueue_scripts', 'generatepress_child_enqueue_scripts', 100 ); add_action('generate_after_header','generate_add_title_below_header'); function generate_add_title_below_header() { // If we're not on a page, don't do anything if ( is_page() || is_single() ) { ?> <div class="page-header-content generate-page-header generate-content-header page-header-title"> <div class="inside-page-header-container inside-content-header grid-container grid-parent"> <header class="entry-header"> <h1 class="entry-title" itemprop="headline"><?php the_title(); ?></h1> </header><!-- .entry-header --> </div> </div> <?php } }
July 26, 2020 at 6:59 pm #1377371Shami
Parent theme function.php code:
July 27, 2020 at 1:53 am #1377606David
StaffCustomer SupportChange this:
add_filter( 'generate_show_post_navigation', '__return_false' );
to:
add_action( 'wp', function() { if ( is_single() ) { add_filter( 'generate_show_post_navigation', '__return_false' ); } } );
July 27, 2020 at 2:06 am #1377622Shami
That worked. Thanks.
July 27, 2020 at 3:58 am #1377728David
StaffCustomer SupportYou’re welcome
August 17, 2020 at 11:17 pm #1407175Shami
I’ve to change the post title color to white on hover. How do I do it? I’m finding it difficult to find the section where I could put:
color: #ffffff;
This is my current CSS:
.post-navigation .nav-links {
display: flex;
}
@media (max-width: 768px) {
.post-navigation .nav-links {
flex-direction: column;
}
}.post-navigation .nav-links div {
display: flex;
flex-direction: column;
flex: 1 0 calc(50% – 2px);
margin: 2px;
padding: 30px;
box-sizing: border-box;
position: relative;
background-color: #ffffff;
border: 1px solid #f3f3f3;
transition: background 0.2s;
border-radius: 2px;
}.post-navigation .nav-links div:hover {
background-color: #15c235;
}.post-navigation .nav-links .previous {
text-align: right;
padding-left: 70px;}
.post-navigation .nav-links .next {
padding-right: 70px;}
.post-navigation .nav-links .label {
text-transform: uppercase;
font-size: 14px;
font-weight: 600 ;
font-family: ‘Lato’, sans-serif;
color: #3d4817;
/* Add font styles for Next-Prev Label */
}.post-navigation .nav-links a {
font-size: 24px;
font-weight: 600;
font-family: ‘Lato’, sans-serif;
/* Add font styles for Post title */
}.post-navigation .nav-links a:before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}.post-navigation .nav-links a:after {
border-left: 1px solid #999;
border-bottom: 1px solid #999;
content: ”;
display: block;
height: 20px;
opacity: 0.8;
position: absolute;
top: calc(50% – 10px);
width: 20px;
}.post-navigation .nav-links .previous a:after {
left: 30px;
transform: rotate(45deg);
transition: all 0.2s;
}.post-navigation .nav-links .next a:after {
transform: rotate(225deg);
right: 30px;
transition: all 0.2s;
}.post-navigation .nav-links .previous a:hover:after {
left: 20px;
}.post-navigation .nav-links .next a:hover:after {
right: 20px;
}Note: This has to be done in the same next-previous post navigation at the end of the blog post. This isn’t a different topic. So I’ve asked in the same thread.
August 18, 2020 at 2:50 am #1407383David
StaffCustomer SupportAdd this CSS:
.post-navigation .nav-links div:hover a { color: #fff; }
September 4, 2020 at 6:43 am #1430657Shami
Hey, this is my current css:
/*css for previous next navigation in post*/
.post-navigation .nav-links {
display: flex;
}
@media (max-width: 768px) {
.post-navigation .nav-links {
flex-direction: column;
}
}.post-navigation .nav-links div {
display: flex;
flex-direction: column;
flex: 1 0 calc(50% – 2px);
margin: 2px;
padding: 30px;
box-sizing: border-box;
position: relative;
background-color: #ffffff;
border: 1px solid #f3f3f3;
transition: background 0.2s;
border-radius: 2px;
}.post-navigation .nav-links div:hover {
background-color: #15c235;
}.post-navigation .nav-links div:hover a {
color: #fff;
}.post-navigation .nav-links .previous {
text-align: right;
padding-left: 70px;}
.post-navigation .nav-links .next {
padding-right: 70px;}
.post-navigation .nav-links .label {
text-transform: uppercase;
font-size: 14px;
font-weight: 600 ;
font-family: ‘Lato’, sans-serif;
color: #3d4817;
/* Add font styles for Next-Prev Label */
}.post-navigation .nav-links a {
font-size: 24px;
font-weight: 600;
font-family: ‘Lato’, sans-serif;
/* Add font styles for Post title */
}.post-navigation .nav-links a:before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}.post-navigation .nav-links a:after {
border-left: 1px solid #999;
border-bottom: 1px solid #999;
content: ”;
display: block;
height: 20px;
opacity: 0.8;
position: absolute;
top: calc(50% – 10px);
width: 20px;
}.post-navigation .nav-links .previous a:after {
left: 30px;
transform: rotate(45deg);
transition: all 0.2s;
}.post-navigation .nav-links .next a:after {
transform: rotate(225deg);
right: 30px;
transition: all 0.2s;
}.post-navigation .nav-links .previous a:hover:after {
left: 20px;
}.post-navigation .nav-links .next a:hover:after {
right: 20px;
}
/*css for previous-next navigation in post end*/New Goal: I’ve to make the archive page navigation look like:
Previous 2 3 4 .. Next
as buttons with color:#009b19Currently, they are appearing as simple links.
Please check the older threads above. I want to keep earlier settings intact. Use my css if possible so that I won’t have to change colors again.
September 4, 2020 at 10:06 am #1431019Tom
Lead DeveloperLead DeveloperHi there,
You can do this to make them look like buttons:
.nav-links > * { display: inline-block; padding: 5px 10px; background: #222; color: #fff; }
Adjust the colors as needed 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.