How to format an HTML element p/ become equal to a button?

Asked

Viewed 210 times

0

I added a new button via shortcode in the description of the Woocommerce/Wordpress product page. I would like to format it in the same layout button (including the effect Hover).

"Configure Now!" is the second button, which needs to be visually equal to the "Buy" button on my template.

Edit:

This is the code q the plugin "Popup" provides for this function:

<a href="javascript:void(0)" class="sg-show-popup" data-sgpopupid="1" data-popup-event="click">Configure Agora!</a>
html wordpress woocommerce

3 answers

0

Well, I found a "palliative" solution. I say this because I don’t know if it’s the right way.

I edited the plugin file that inserts the class in the item. Specifically this snippet of code:

        if(isset($args["wrap"])) {
        echo "<".$args["wrap"]." class='sg-show-popup ' data-sgpopupid=".@$args['id']." $attr data-popup-event=".$eventName.">".$content."</".$args["wrap"]." >";
    } else {
        echo "<a href='javascript:void(0)' class='sg-show-popup button' data-sgpopupid=".@$args['id']." $attr data-popup-event=".$eventName.">".$content."</a>";
    }
}

I inserted the same class that the theme uses to style the button. A class "button".

Is there any other way to do it, or is it okay to keep it that way? The problem here is that I will need to edit this file whenever the plugin is updated. =/

0


You can solve this using jQuery! 

jQuery('.sg-show-popup').addClass('button');

With this code, you select all items that have the class .sg-show-popup and adds to each item in that list the class button. Just add this script to your theme by cutting the need to edit the plugin.

  • Thanks for your help, Hamurabi. I’ll do as you indicated :) Looking at your profile, I saw that you play CS:GO as well. Add me p/ people exchange an idea? ;D https://steamcommunity.com/id/tibeh

  • Yes, of course! Once I have access to Steam I will add you.

  • Do you develop plugins for Wordpress? Are you interested in participating in a project for the community? : ) http://bigcs.com.br/quem-somos/ !

  • I submitted the request on Steam: marubah. Add that we talked

0

If you prefer, you can simply add the class button in the direct element in html.

Browser other questions tagged html wordpress woocommerce

You are not signed in. Login or sign up in order to post.