[Resolved] Editing HMTL Coded Buttons

Home Forums Support Editing HMTL Coded Buttons

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1395949
    Stefan

    Hi GeneratePress,

    I would like to edit GP Theme buttons associated with Memberful. I am talking about the following page: https://www.lifestyledemocracy.com/support/

    I would like to:

    1) Ensure the suggestion text inside the box “Choose your contribution” is visible on mobile as well. On my desktop it is visible, but on mobile I get the current view. https://prnt.sc/txb3qt

    2) Make the buttons “I want to build” and “I want to contribute” round, just like the “Support” button.

    3) Center the text box and the buttons associated with membership/payment.

    I hope you can help out.

    Regards,
    Stefan

    #1396179
    Leo
    Staff
    Customer Support

    Hi there,

    1. Try this CSS:

    @media (max-width: 768px) {
        input[type=number]::placeholder {
            font-size: 14px;
        }
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    2. Try this CSS:

    input[type="submit"] {
        border-radius: 5px;
    }
    #1399710
    Stefan

    Hi Leo,

    Thanks! And how, do I center all the content boxes? They are now left aligned.

    #1401151
    Leo
    Staff
    Customer Support

    Are you able to center those entire blocks for the Ultimate addons for Gutenberg plugin?

    That would be the best solution.

    #1405911
    Stefan

    Hi Leo,

    Unfortunately, only partially.

    The “Choose Your Contribution” and “I want to build” and “I want to support” buttons are HTML codes provided by Memberful. I do not have an option to center them horizontally.

    The horizontal alignment for the the Ultimate addons for Gutenberg blocks works for the blocks above and below this HTML code block from Memberful.

    The centering for the contents of the entire blocks (using Ultimate addons), encompassing all the blocks (including the ones from Memberful) is only available for vertical alignment.

    This is the HTML code from Memberful and I don’t know how to make it aligned to the center. Maybe if I post it below you will be able to help out:

    <form action=”https://lifestyledemocracy.memberful.com/checkout&#8221; method=”get”>
    <input type=”hidden” name=”plan” value=”49681″>
    <input type=”number” name=”price” placeholder=”Choose your contribution” required=”required” min=”48.00″ step=”1″>
    <input type=”submit” value=”I want to build”>
    </form>

    #1406109
    David
    Staff
    Customer Support

    Hi there,

    edit the first line of the Forms HTML and add class="memberful-form" to it – so it looks like this:

    <form class="memberful-form" action="https://lifestyledemocracy.memberful.com/checkout" method="get">

    Then add this CSS:

    
    /* Center form content */
    .memberful-form {
        text-align: center;
    }
    /* Add some space between inputs */
    .memberful-form input {
        margin-bottom: 1em;
    }
    #1406519
    Stefan

    Worked like a charm! Thank you 🙂

    #1406909
    David
    Staff
    Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.