Okay
  Public Ticket #1429789
Button in fullscreen height page header
Closed

Comments

  • Bepatient started the conversation

    Hi Salient team, 

    I 'd like insert a call to action button below the logo un the header. 
    I tried with this kind of code : 
    [button color="extra-color-2" hover_text_color_override="#fff" image="default-arrow" size="large" url="#fonctionnalites" text="En savoir plus" color_override=""]


    But it doesn't work. Any idea or help to solve this? Thanks a lot for your reply. 

    Best regards and have a good weekend. 

    Alex


  •  3,034
    Andrew replied

    Hi Alex,

    Sorry for the late reply.

    This is not really possible with the header as it does not have an area to add shortcodes or text.

    You would need to add that shortcode to the page content area on your homepage in the first item \ row \ on the page.

    Cheers.

  • Bepatient replied

    Hi Andrew and thanks a lot for your reply. 

    Ok, we can't use shortcake in this area. But can we use html or css code in this area 
    to design a button? 

    Have a good day. 

    Alex

  •  3,034
    Andrew replied

    Hi Alex,

    You can try and use HTML tags on the page header setting area i.e. on the page header title and subtitle areas and then use CSS to style it on the front end to buttons.

    Hope you can implement that.

  • Bepatient replied

    Thanks Andrew, I did this 
    https://www.point-of-prevention.com/

    I'd preferred a css button, but I don't which code use in the header setting fields. 

    Best regards


    Alex

  •  3,034
    Andrew replied

    Hi Alex,

    You can use this HTML for the button:

    <a class="nectar-button small regular accent-color  regular-button" href="https://google.com" data-color-override="false" data-hover-color-override="false" data-hover-text-color-override="#fff">title here</a>
    

    Then change what it links to.

    What you can also do is add a button element on the page content area, configure it with what you want, save age and then view the page on the front end.

    Then copy that html from the front end using inspect element and use it as the HTML on that area in the page header settings.

    Cheers.

  • Bepatient replied

    Thank you very much Andrew, 

    It works and it's better than a button image :)
    Like this the button is responsive. 

    Thanks a lot.

    Have a good day. 
    Best regards.

    Alex