Align Popup Trigger

All the content on your website is center aligned and you want the button trigger for your content to appear in the center and not left-aligned. Now, you can tweak the pop-up code that you picked up from your Outgrow calculator to achieve this quickly.

Click on the "Configure" tab in the builder and go to the "Embed on a webpage" section on the left navigation. Configure your popup trigger and copy the code.

1348

Code you copied will look like this -:

<div>
<div id='5a45ece43597bfa845dc4217' data-embedBorderRadius='0' data-embedFontSize='12' data-textcolor='#ffffff' data-bgcolor='#fb545b' data-prop='outgrow-p' data-type='outgrow-b' data-url='https://democo.outgrow.us/5a45ece43597bfa845dc4217' data-text='Get Started'>
</div>
<script src='//dyv6f9ner1ir9.cloudfront.net/assets/js/ploader.js'>
</script><script>initIframe('5a45ece43597bfa845dc4217');
</script>
</div>

On adding this code to your Wordpress/HTML website the pop up trigger will appear like this

1128
  • Edit the code
    In the outer div of the pop up code add butn-outr class and style tag.
<div class="butn-outr">
  <div id='5a45ece43597bfa845dc4217' data-embedBorderRadius='0' data-embedFontSize='12' data-textcolor='#ffffff' data-bgcolor='#fb545b' data-prop='outgrow-p' data-type='outgrow-b' data-url='https://democo.outgrow.us/5a45ece43597bfa845dc4217' data-text='Get Started'>
  </div>
  <style>div.butn-outr{text-align:center; width:100%; float:left;}</style>
  <script src='//dyv6f9ner1ir9.cloudfront.net/assets/js/ploader.js'></script><script>initIframe('5a45ece43597bfa845dc4217');</script>
</div>

Now paste this code in your HTML/Wordpress site. The button for pop up will be center aligned.

1143

If you have any questions, feel free to drop us an email at [email protected] and we will be happy to help you out.