[Resolved] Change Pagination Text on Mobile

Home Forums Support [Resolved] Change Pagination Text on Mobile

Home Forums Support Change Pagination Text on Mobile

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #586749
    Guy

    Hi There.
    I wish to change the text of the pagination for “Next” and “Previous”
    Only for mobile.
    Is there any way I can do that through function.php?

    Thanks!

    Guy

    GeneratePress 2.1.2
    GP Premium 1.6.2
    #586929
    David
    Staff
    Customer Support

    Hi, what would you want to change the text to?

    #586932
    Guy

    to “Next” and “Previous”.
    without the name of the post Only on mobile since the names of the projects are too long for mobile…

    Thanks!!!!

    #586957
    David
    Staff
    Customer Support

    You can try this:

    @media (max-width: 480px) {
        .post-navigation .nav-previous .prev a, .post-navigation .nav-next .next a {
            visibility: hidden;
        	font-size: 0em !important;
        }    
        .post-navigation .nav-previous .prev a:after {
            content: 'Previous';
        }
        .post-navigation .nav-next .next a:after {
            content: 'Next';
    
        }
        .post-navigation .nav-previous .prev a:after,
        .post-navigation .nav-next .next a:after {
            visibility: visible;
            font-size: 16px !important;
        }
        .nav-next .next:before {
            content: "";
        }
        .nav-previous .prev:before {
            width: 0px !important;
        }
        .nav-previous .prev .smaller {
            font-size: 0em !important;
            margin: 0 !important;
        }
    }
    #587573
    Guy

    Thank so much for your response.
    I tried doing what you suggested, but then trying to fix the css was impossible.
    The thing is that the “next” and”previous” are floating in a very strange place around there.
    http://80.179.140.91/~sharon2/branding/mint-groupcondominium-servicestoronto-canada/

    Is there any way of doing that through a hook?

    Thank again

    Guy

    #587675
    David
    Staff
    Customer Support

    Hi Guy, i will speak with Tom to see if it’s possible to hook a second filtered nav that is only displayed on mobile.

    But in the meantime, if you want to just add the code i provided and i’ll take a look to see if i can align it for you. Let me know,

    #587710
    Guy

    I added. You can watch in on mobile…

    #587758
    David
    Staff
    Customer Support

    Hi Guy, i have updated the code above, lost of ‘unpicking’ to do. So give that a shot and let me know.

    #588170
    Guy
    	.post-navigation .nav-previous .prev a, .post-navigation .nav-next .next a {
            visibility: hidden;
        	font-size: 0em !important;
        }    
        .post-navigation .nav-previous .prev a:after {
            content: '< Previous';
        }
        .post-navigation .nav-next .next a:after {
            content: 'Next >';
    
        }
        .post-navigation .nav-previous .prev a:after,
        .post-navigation .nav-next .next a:after {
        visibility: visible;
        font-size: 1rem;
    	line-height: 1.5em;
    	font-weight: 300;
    	letter-spacing: 0.05rem;
    	
    	}
    	
    	    .post-navigation .nav-previous .prev a:after{
            position: relative;
    			left: -35px;
        }
    	
    	.post-navigation .nav-next .next a:after {
    		
    	position: relative;
    			left: 22px;
    		
    		
    	}
        .nav-next .next:before {
            content: "";
        }
    	 .nav-previous .prev:before {
            content: "";
        }
    	
        .nav-previous .prev:before {
            width: 0px !important;
        }
        .nav-previous .prev .smaller {
            font-size: 0em !important;
            margin: 0 !important;
        }
    	
    	

    Solved 🙂 Thanks!!!!

    #588222
    David
    Staff
    Customer Support

    Hi Guy, that did take some ‘unpicking’ lol. Glad you found a solution!

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.