Pinterest icon doesn't work

  • Author
    Posts
  • #137804

    Hello!

    I want to add a Pinterest icon on my social media icons but it doesn’t work.

    I tried to use this code that I found on another topic:

    .jetpack-social-navigation-genericons a[href*=”pinterest.”]:before {
    content: “\f210”;
    }

    Hope you can help me! Thanks!

    The blog I need help with is viceversa.pt.

    #137812

    ricardpriet
    Theme Author

    Hi there,
    thank you for writing :)

    Yes, the code is valid, but the double quotes character should be straight. Just copy the following and paste it in your Custom CSS tab:

    .jetpack-social-navigation-genericons a[href*="pinterest."]:before {
        content: "\f210";
    }

    Note the difference between ” and ”

    Hope this helps :)
    Ricardo P. from SiloCreativo

    #137814

    Hi Ricardo,

    Thank you for the reply. We used that code, but when we published after the page refresh the icon disappear again. And also de CSS code.

    #137834

    ricardpriet
    Theme Author

    Hi there.

    That is very strange!
    Do you have any other CSS code written before? Maybe that piece of code is causing issues. Please, send us a screenshot of your Adicional CSS Tab in order to check what is wrong:
    https://en.support.wordpress.com/make-a-screenshot/
    https://en.support.wordpress.com/custom-design/editing-css/

    We understand that after adding the CSS, the Publish button is clicked but when you reload your page the CSS code disappears. Is it correct?

    Thank you,
    Ricardo

    #138071

    Hi Ricardo,

    There is our CSS code:

    /*
    Bem-vindo ao CSS Personalizado!
    
    Para saber como isto funciona, consulte http://wp.me/PEmnE-Bt
    */
    span.reading-time {
    	display: none !important;
    }
    
    .single .entry-meta span.author {
    	display: none !important;
    }
    
    .single .entry-meta span.categories-links-index {
    	display: none !important;
    }
    
    .single .entry-meta span.tags-links {
    	display: none !important;
    }
    
    h1.entry-title {
    	font-size: 20px;
    }
    
    .page-title {
    	display: none;
    }
    
    .site-info a, .site-info .sep {
    	color: #999999 !important;
    }
    
    @media (max-width: 991px) {

    Thank you!

    #138072
    /*
    Bem-vindo ao CSS Personalizado!
    
    Para saber como isto funciona, consulte http://wp.me/PEmnE-Bt
    */
    span.reading-time {
    	display: none !important;
    }
    
    .single .entry-meta span.author {
    	display: none !important;
    }
    
    .single .entry-meta span.categories-links-index {
    	display: none !important;
    }
    
    .single .entry-meta span.tags-links {
    	display: none !important;
    }
    
    h1.entry-title {
    	font-size: 20px;
    }
    
    .page-title {
    	display: none;
    }
    
    .site-info a, .site-info .sep {
    	color: #999999 !important;
    }
    
    @media (max-width: 991px) {
    #138699

    ricardpriet
    Theme Author

    Hello there,
    Sorry for delay, but we have not received any notification telling us that this topic has new answer :(

    It seems the code you sent us is uncompleted ( “@media (max-width: 991px) {” needs a close tag).

    Anyway, please add the CSS code for the icon at the beginning of your Custom Code.

    You have this:

    /*
    Bem-vindo ao CSS Personalizado!
    
    Para saber como isto funciona, consulte http://wp.me/PEmnE-Bt
    */
    span.reading-time {
    	display: none !important;
    }

    change to this:

    /*
    Bem-vindo ao CSS Personalizado!
    
    Para saber como isto funciona, consulte http://wp.me/PEmnE-Bt
    */
    .jetpack-social-navigation-genericons a[href*="pinterest."]:before {
        content: "\f210";
    }
    span.reading-time {
    	display: none !important;
    }

    Please, let me know and sorry again!
    Ricardo P.

You must be logged in to reply to this topic.