1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved DU Header Style 3

Discussion in 'Basic Support Forum' started by Dianne Vos, Nov 18, 2019.

  1. Dianne Vos

    Dianne Vos New Member

    Hi, is there a way to modify the placeholder for the search function on style 3

    As soon as we press the button that makes the input field appear
    the placeholder is already gone.

    if we deselect the search bar we see the placeholder move along with it.

    How it's supposed to work:
    https://header-demo.diviultimate.com/style-3/
     
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Add more varieties for your Divi header (12 premade styles) + menu hover effects:Learn More
  2. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    You can add placeholder in the search module settings. See screenshot below:

    upload_2019-11-18_17-55-32.png
     
  3. Dianne Vos

    Dianne Vos New Member


    We're using a different part of the module.

    We checked it at the elements tab.

    And within that menu i can't seem to find "Placeholder"
     

    Attached Files:

    1. PRO MEMBER PERKS Divi Block Pro - Premade mega menu design for your Divi site without using any plugins:View Demo
  4. Dianne Vos

    Dianne Vos New Member


    Example below
     

    Attached Files:

  5. Dianne Vos

    Dianne Vos New Member

    Our placeholder also dissappears upon clicking the search icon
     
    1. PRO MEMBER PERKS Divi Powerful Child Theme - Power up your Divi sites with tons of new functionalities & premade elements:Learn More
  6. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    To change the placeholder text, you will need some jQuery code to tweak the value.

    Try the below code in Divi > Theme Options > Integration > Body Code:
    Code:
    Log In or Sign Up to view this code.
    The placeholder should only disappear when you type something in the search bar.

    If not, kindly share your URL.
     
  7. Dianne Vos

    Dianne Vos New Member

    http://185.224.89.32/~hvm/

    I placed the code within body,
    Didn't work
     
    1. PRO MEMBER PERKS Divi Powerful Child Theme - Power up your Divi sites with tons of new functionalities & premade elements:Learn More
  8. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    You should go to the menu module settings & disable the search option.

    Then proceed to enable our search option in Theme Customizer > Divi Ultimate Header Plugin > Header & Navigation Styling > Show Search In Custom Menu
     
  9. Dianne Vos

    Dianne Vos New Member

    I've found out that the jquery code within this module
    automatically set the placeholder to "" on .click

    so i added this jquery code to yours
    ```
    $('.et-search-field').focus(function()
    {
    $('.et-search-field').attr('placeholder','The same some new text');
    }
    )

    });
    ```


    ```
    jQuery(function($){
    $('.et-search-field').attr('placeholder','Search Text');

    $('.et-search-field').focus(function()
    {
    $('.et-search-field').attr('placeholder','Search Text');
    }
    )

    });
    ```
    The problems since the beginning was that the placeholder dissappeared when the input was input:focus

    So i added this to the code :)

    Thanks for the sample code.

    Problem resolved!
     
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Industrial' Divi layout for all Pro members:View Demo