Buy me a coffee

Click Header Button – Show a Popup

#1. First, you need to change the Header button URL to #popup

and make sure “Open Link in new tab” is disabled.


#2. Add a section in the Footer and design its layout, we will get this to become popup content

#3. Use this tool to find this Section ID. In my example, we will have

  • [data-section-id=”65fc64444b00577e6193d377″]


#4. Use this code to the Custom CSS box

[data-section-id="65fc64444b00577e6193d377"] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 999999;
    width: 90%;
    min-width: 300px;
    max-width: 750px;

footer.sections {
    z-index: 9999999 !important;
[data-section-id="65fc64444b00577e6193d377"]  .section-border {
    top: 0 !important;

span.close-popup {
    position: fixed;
    top: 10px;
    left: 10px;
[data-section-id="65fc64444b00577e6193d377"] {
   display: none;
.show-popup {
    display: block !important;

span.close-popup {
    background-color: #ebfc72;
    color: #000;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;


#5. Use this code to Code Injection – Footer

<script src=""></script>


#6. The result when users click on the Contact Us Header button


Ask me a question, free

If your site is private or in trial, just setup password and share url. See how to:
Please check your email carefully. Recently I got a lot of questions with wrong emails.

If you haven't heard from me within 24 hours please check your junk/spam folder