Woocommerce tips: How to Display “NEW” Badge on Recent Products

Поділитися
Вставка
  • Опубліковано 21 гру 2024

КОМЕНТАРІ • 33

  • @SohailVayani
    @SohailVayani 2 роки тому

    Thank you for this tutorial, quick question can I use this code on the blog posts? Thanks

  • @AnilKumar-lg4kz
    @AnilKumar-lg4kz Рік тому

    Hi bro, I like your work. I do not want to show ''NEW BADGE'' on specific products, even though they are very newly uploaded. Can you give the snippets for that? and also please make a video on that. I will be grateful for your answer. Best Greetings, Anil

    • @wpsimplehacks
      @wpsimplehacks  Рік тому +1

      Modifye the code to use conditional logic. Here are some examples for you www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/

  • @yourwebsiteevolution7884
    @yourwebsiteevolution7884 3 роки тому

    Hello and thanks for the video and coding. But how can i set the badge on the right, not to the left. Thanks

    • @wpsimplehacks
      @wpsimplehacks  3 роки тому

      It depends on your theme. It would be ask from the theme developer.

  • @thefuzzman9833
    @thefuzzman9833 2 роки тому

    Greetings, does this still work in the latest woocommerce, i have tried but it is not working. Thank you.

    • @wpsimplehacks
      @wpsimplehacks  2 роки тому

      Yes, it works. Maybe your theme is using its own hooks that overrride Woocommerce default hooks. If so, then you need to use hooks that your theme uses.
      Also, page builders (like Elementor) override Woocommerce hooks.
      The easiest way to test it is to activate default Storefront theme, deactivate page builders and see whether it works over there.

  • @KristaMollion
    @KristaMollion 2 роки тому

    Hi, thank you for the video! I added the circle code and unfortunately the word 'new' is not in the circle....not sure why! Any advice would be appreciated how to center it.

    • @wpsimplehacks
      @wpsimplehacks  2 роки тому +1

      It’s hard to say without seeing this site.

  • @jefersonhartmann5486
    @jefersonhartmann5486 Рік тому

    Awesome video! How to display image badge for categories and tags?

    • @wpsimplehacks
      @wpsimplehacks  Рік тому +2

      I haven’t tested it with conditionals but try conditional logic like shown here www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/

    • @jefersonhartmann5486
      @jefersonhartmann5486 Рік тому

      @@wpsimplehacks Thank you!

  • @roberthedlund8382
    @roberthedlund8382 3 роки тому

    Thank you for this wonderful guide! Working perfectly :)

  • @WayneRigley
    @WayneRigley 4 роки тому

    just about there.. but getting the sale under the new and im stupid to figure out out to remove one but nice video !

    • @wpsimplehacks
      @wpsimplehacks  4 роки тому

      Use some CSS to move the badge either to left or right.

  • @camilameyer
    @camilameyer 2 роки тому

    Thank you, this worked so well!!! :)

  • @shahzebjafar4487
    @shahzebjafar4487 3 роки тому

    @WP Simple Hacks - Wordpress tips and tricks
    Also how can I display this badge to only one product category.
    Say "Shirts" etc.

    • @wpsimplehacks
      @wpsimplehacks  3 роки тому

      You have to use conditionals. See here www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/

    • @MdRehan-fe5fp
      @MdRehan-fe5fp 3 роки тому

      @@wpsimplehacks can you provide me full code with category condition

    • @wpsimplehacks
      @wpsimplehacks  3 роки тому

      @@MdRehan-fe5fp Sorry, since I have too much stuff on my plate (family, work, hobbies etc.) I don’t provide this kind of support here. I hope you understand. All the Woo conditionals with samples are here. Just modify your code accordingly www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/

    • @MdRehan-fe5fp
      @MdRehan-fe5fp 3 роки тому

      @@wpsimplehacks can you just provide me the "if statement code" for category...like ----
      this is the full code...just tell me how to put the if statement pls
      add_action( 'woocommerce_before_shop_loop_item_title', 'new_badge', 3 );
      function new_badge() {
      if ( is_product_category( 'books' ) ){ //here i put if statement
      global $product;
      $newness_days = 30; // Number of days the badge is shown
      $created = strtotime( $product->get_date_created() );
      if ( ( time() - ( 60 * 60 * 24 * $newness_days ) ) < $created ) {
      echo '' . esc_html__( 'NEW', 'woocommerce' ) . '';
      }
      }
      }

  • @shahzebjafar4487
    @shahzebjafar4487 3 роки тому

    Hi @WP Simple Hacks - Wordpress tips and tricks
    Thank you for the code snippet.
    It's working perfectly.
    But it does not show Badge on single product page. It only show badge in shop page.
    Can you please help me to show custom badge in single product page too?
    Thanks in advance :)

    • @wpsimplehacks
      @wpsimplehacks  3 роки тому

      Try this one here below. It should add "New" badge below your product title. If you need it to be on the product image then you need to customize it by yourself using proper hooks from the visual hook guide here: www.businessbloomer.com/woocommerce-visual-hook-guide-single-product-page/
      It uses class "itsnew" and you can customize it by adding something like this inside Additional CSS:
      .itsnew {
      background: #f37b21;
      padding: 5px 10px;
      font-size: 12px;
      font-weight: 700;
      color: #fff;
      }
      // New badge for recent products on single product page
      add_action( 'woocommerce_single_product_summary', 'new_badge_single_product', 7 );
      function new_badge_single_product() {
      global $product;
      $newness_days = 30; // Number of days the badge is shown
      $created = strtotime( $product->get_date_created() );
      if ( ( time() - ( 60 * 60 * 24 * $newness_days ) ) < $created ) {
      echo '' . esc_html__( 'NEW', 'woocommerce' ) . '';
      }
      }

  • @Properture
    @Properture 3 роки тому

    New badge snippet code & CSS Ribbon style didnt work on elementor...

    • @wpsimplehacks
      @wpsimplehacks  3 роки тому

      It’s because elementor overwrtes Woocommerce hooks and uses their own hooks.

    • @Properture
      @Properture 3 роки тому

      @@wpsimplehacks thanks so how to remedy it? OR the snippet codes cannot be used at all?

  • @RATaveira
    @RATaveira 3 роки тому

    Amazing!!! Thanks a lot!

  • @davutyankar
    @davutyankar 4 роки тому

    Thank for the tips