Home>Support>Site Origin Button Widget

Site Origin Button Widget

I have been using page builder to layout my home page. On this page I want2 buttons that will be side by side and both will be centered. When I try and add the widgets for the 2 buttons they appear underneath one another. I know I can split the row in 2 and either center both buttons (which puts them too far apart for me)… or I can right align one button and left align the other one to get the buttons closer together. That second option works fine except at the smaller screen sizes. Then those two sections of the row stack underneath one another with the buttons miss-aligned. Please advise so I can accomplish what should be a very easy task. :) Code please? :) Thanks in advance for any help you may provide. P.S. I am using the Premium Vantage Theme.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 6 years, 3 months ago Andrew Misplon Hi, I Work Here

    Hi Blessingsgirl

    One way you could achieve this would be to insert a Layout Builder widget. Within the Layout Builder, insert one row with two columns and then a button widget into each column. Let us know how that goes :)

  2. 6 years, 3 months ago blessingsgirl

    Andrew, thanks for your help. That's what I had done. I used the page builder to insert a row with 2 columns and then centered each button in each column. But the problem with that was that I wanted the buttons to be closer together yet not touching. Okay, so then I right-aligned the button in one column and left-aligned the button in the other column. That did give me the desired effect of having 2 buttons side by side and reasonably close together. However, when the screen was at smaller dimensions to where it collapsed into one column, the buttons no longer looked as good. One was off to the right a bit and the other one off to the left. There should ble another way to accomplish this through CSS but when I looked at the code (using inspect element through chrome) I couldn't figure which classes I needed to target to make this happen. Please advise. Thanks! Love this theme by the way. Marcia

  3. 6 years, 3 months ago Andrew Misplon Hi, I Work Here

    Do you have a public URL where we can take a look at what’s going on? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.

    • 5 years, 3 months ago Private Message - Daniel Karan

      This is a private message.

  4. 5 years, 3 months ago Andrew Misplon Hi, I Work Here

    Hi Daniel

    At the moment this would need to be done with a three column row. Insert a Layout Builder into the middle column and insert two columns in your Layout Builder.

    lb

    lb-2

  5. 5 years, 3 months ago Private Message - Daniel Karan

    This is a private message.

  6. 5 years, 3 months ago Andrew Misplon Hi, I Work Here

    Hi Daniel, the Layout Builder not opening sounds like a plugin conflict. Try testing with all non-SiteOrigin plugins deactivated.

    Please, open a new thread here: Page: New Thread. Send me the link once open and I’ll assist there. Thanks

  7. 5 years, 3 months ago Private Message - Daniel Karan

    This is a private message.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More