How to Customize TAKE THIS COURSE button and so on?

Home Forums Legacy Support Support queries Styling issues How to Customize TAKE THIS COURSE button and so on?

Viewing 15 posts - 1 through 15 (of 19 total)
  • Author
    Posts
  • #299367
    spyboys
    Spectator
    HI, I want to customize TAKE THIS COURSE button to BUY NOW https://imgur.com/ofXCZXD.png and i wanna change that TAKE THIS COURSE section similar to udemy make add to cart button under TAKE THIS COURSE below how can i customize like this https://i.imgur.com/Ggc3JG0.png please guide me
    #299463
    spyboys
    Spectator
    hello reply me
    #299478
    Diana
    Participant
    You actually want to change the text which you can do by using Loco Translate Plugin Share the page URL for styling the button Take this course similarly as Buy Now. We will share custom CSS for that
    #299487
    spyboys
    Spectator
    #299489
    spyboys
    Spectator
    i want to add add this cart button also under the buy now option
    #299793
    spyboys
    Spectator
    hello
    #299799
    Diana
    Participant
    Okay, wait let me share the code Edited Reply Add this code in wp-admin > Plugins > Editor > Select WPLMS Customizer Plugin >wplms-customizer.php
    
    add_filter('wplms_course_details_widget','custom_add_second_button',9);
    
    function custom_add_second_button($x){
        ?>
        <style>
            .second_button{
            background-color: transparent !important;
            border: 1px solid #2896a9;
            color: #0f7c90;
            }
        </style>
        <?php
      echo '<a class="full button second_button">Second button</a>';
    
    return $x;
    
    }
    
    Please cross check the code from here: http://prntscr.com/u9g0e0
    #299833
    spyboys
    Spectator
    Now the button is appear under the TAKE THIS COURSE section but the button is not working note: when user click the the second button which means add to cart button the product add into the cart, now second button do nothing. Refer this video :: https://youtu.be/WjJke8sOSG4 please guide me.
    #300061
    Diana
    Participant
    But if the "take this course" button does the same thing. Here is my point, then why do you need that second button for that same functionality?
    #300069
    spyboys
    Spectator
    look when user click that add to cart button the product dirctly add to cart i want this feature but take this course is directly redirect to check out page. note ; i want add to cart function seprately
    #300330
    Jackson
    Blocked
    Hello, First please use this code skip given above : Add this code in wp-admin > Plugins > Editor > Select WPLMS Customizer Plugin >wplms-customizer.php
    add_filter('wplms_take_course_button_html','show_add_to_cart_button_on_take_this_course',99,2);
    function show_add_to_cart_button_on_take_this_course($html,$course_id){
      $product_id = get_post_meta($course_id,'vibe_product',true);
      $html .= do_shortcode('[add_to_cart id="'.$product_id.'" sku=""]');
      return $html;
    }
    Now add the bellow css in your appearance->customize->custom css: .single-course .product.woocommerce.add_to_cart_inline {border: none !important;padding:0 !important;} .single-course .product.woocommerce.add_to_cart_inline del,.single-course .product.woocommerce.add_to_cart_inline ins,.single-course .product.woocommerce.add_to_cart_inline span {display:none;} But first please remove code given by @diana Refer: https://prnt.sc/uanxa3 i have replicate same on my local setup, Thanks,
    #300531
    spyboys
    Spectator
    its working and i want customize add to cart button like udemy style https://imgur.com/cfDTgCh.png any custom css for this
    #300668
    spyboys
    Spectator
    i want to change https://imgur.com/AcEnaSK.png this button to like this https://imgur.com/cfDTgCh.png
    #300687
    Jackson
    Blocked
    Hello, Goto appearance>>customize>>custom css and use code given below: #course-pricing a.course_button.full.button { background-color:white !important; border-color:blue !important; border: 1px solid !important; color:blue !important; font-size:15px !important; padding-top:10px !important; padding-bottom:10px !important; } Refer: https://prnt.sc/ubbciu Note: you can change color according to your need Thanks,
    #300748
    spyboys
    Spectator
    hi thanks but i need to change add to cart button like this
Viewing 15 posts - 1 through 15 (of 19 total)
  • The topic ‘How to Customize TAKE THIS COURSE button and so on?’ is closed to new replies.