skip to Main Content

To customize some pages/plugins of a WordPress page I have to use CSS because the dashboard doesn’t allow these changes.

I’m having problems with a specific case. I want to change the text of an item in a list. In this case I want to change the text "Certificates" by "Certificados". The HTML code is this:

<ul>
...
<li class="certificates">
  <a href="https://url/to/user_1/certificates" data-slug:"https://url/to/user_1/certificates">
    <i class="fas fa-certificate">
      ::before
    </i>
    Certificates
    ::after
  </a>
</li>
...
</ul>

In other cases I used something like this to change texts in CSS with success:

.class-to-change {
    visibility: hidden;
}
.class-to-change:after {
    visibility: visible;
    content: "new text";
}

But my list item seems very complex to apply this solution. Could I change the text using CSS in that case?

2

Answers


  1. You may embed "Certificates" in

    html tag. In this way you will have p element nested into li tag. After that you could set its display property to "none" (display: none;) and then might use this code:
    i::after { content: "new text"; }

    Login or Signup to reply.
  2. There is an option that we can override our custom css with plugin css. These are the steps which fixed your issue.

    1. Then add a dequeue function to the functions.php file, and invoke it on the wp_enqueue_scripts with a priority higher than the priority level set on the plugin’s original enqueue function. e.g.

       function custom_style() {
            wp_dequeue_style( 'plugin_css' );
           wp_dequeue_style( plugin_css_2' );
           wp_enqueue_style( 'custom-style', get_bloginfo('stylesheet_url') );
       }
      

      add_action(‘wp_enqueue_scripts’, ‘custom_style’, 99 );

    2. In your custom_style you can write whatever css code you have written and override the property of class.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search