Donate Button in header

  • Resolved b2bt

    (@b2bt)


    9 years, 9 months ago

    Hi,
    I’m making a website for a non-profit, and we want to add a donate button in the header. I tried putting a button in topbar but it didn’t look so good.

    Now I’m planning I’ll add a page, add it into menu, and make it look like a button by changing color surrounding it (check image). This page will then directly have a simple form (with text field ‘name’, ’email’, ‘amount’ and button ‘donate now’) and a payment gateway.

    I will be very grateful if you can tell me how to change color, and more than grateful if you can tell me how should I go about making that form ??

    [I tried give donation plugin but I guess it won’t work as the NGO in India, and give supports no payment gateway for the same.]

Viewing 13 replies - 1 through 13 (of 13 total)

  • Hey,
    So can you post a link to your site? I can help with the css for the menu item to make it look like a button.

    as for the forum are you planning on using paypal as the payment gateway or something else? Whatever gateway your using would be the best place to start in how to build the forum, If your using paypal there are a lot f plugins that off this but if your using a different one then I suggest contacting the gateway and asked theme for the forum code.

    Hope that helps,

    Kadence Themes

    Thread Starter b2bt

    (@b2bt)

    Hi,

    The website is not live yet. It will be live in a day or two. I’ll contact you then or is there other way to share the css?

    Need to see what menu item id it is for the css to work so need a link.

    Kadence Themes

    Thread Starter b2bt

    (@b2bt)

    The site is not live – touchonelife.org
    Can you please check it?
    We can have a white background with black text.

    So are you wanting the “get involved” to look like a button?

    Kadence Themes

    Thread Starter b2bt

    (@b2bt)

    Wow! So quick reply!
    Actually I’ll get the sub page “Make a Donation” out on the menu and name it “Donate”

    Right now we have only offline donation options (through cheques).
    Once I figure out the code for attaching a gateway page to a button (or directly the menu page named “donate”), then we would have online donation options for user

    ok, once you add it make sure to clear your wp super cache.

    Kadence Themes

    Thread Starter b2bt

    (@b2bt)

    I hope you are going to provide me how to do it ??
    the button thing…

    hannah

    (@hannahritner)

    You haven’t added a Donation link to your menu yet?

    Thread Starter b2bt

    (@b2bt)

    I have added it now. Actually, I thought you”ll provide me the css and after that I can do it on my own.

    The thing is that we are not up with the right donate page yet. However, I’m not using the old page

    hannah

    (@hannahritner)

    You can use css like this:

    .sf-menu li:nth-child(7) {
  background-color: #666;
}

    Just paste it in your custom css box in Theme Options > Advanced Settings.
    Hope that helps!

    Hannah

    I’m going to suggest this incase you move your menu item around, this also included styling for a hover effect.

    #nav-main .sf-menu li.menu-item-673 > a {
  background-color: #fff;
  color: black;
  border-radius: 6px;
}
#nav-main .sf-menu li.menu-item-673 > a:hover {
  color:yellow;
  background-color:black;
}

    Kadence Themes

    Thread Starter b2bt

    (@b2bt)

    Hi,
    nothing happened after adding the code in the penultimate comment. But the after adding the code in the latest code the changes happened. Wow! it looks beautiful! Thanks a lot! I really appreciate it!

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Donate Button in header’ is closed to new replies.