Container/div settings

Hello,

today I added some new code for a widget on my website “hotel-felsentor.de”. But I can’t cope with it. I have inserted the following lines of code:

In the header: <script src="//[widget.customer-alliance.com/reviews/js/standard/baae45f84f040113.js](http://widget.customer-alliance.com/reviews/js/standard/baae45f84f040113.js)" async></script>

On the home page I have added a corresponding div in its own container, the ID is: ca-widget-container.

My question about that: How do I get the widget properly positioned? The mishap can be seen on the page “hotel-felsentor.de”.

Here are also some screenshots from inside blocs.

Hello @Steffscheff, is this that you want?

This is on mobile version, with a different code:


There you have the instructions…

https://customer-alliance.atlassian.net/wiki/spaces/CAA/pages/121929734/CA+Widget+JavaScript+API

Yes, i tried. but i do not get it. how do i use this instruction?? :thinking:

ok.

If you want the reviews as my first example, on the end of the page. Do as following:

1- Click in the hamburger symbol (definitions next to the arrows):

image

2- Click in button “Add Code”:

3- Delete the content and add the following code:

<script src="//widget.customer-alliance.com/reviews/js/standard/baae45f84f040113.js" async></script>

In this way you will have the review box always on the right end of the page, even if you scroll the page:


If you want the review in a fixed part of your website, do the same thing as I explain above and add the following:

OPTION 1:

  1. Add a container bric in any part you want the review:

  1. In the ID of this container add the following ID: ca-widget-container
    2.1) Select on the left the container bric and on the right ID type: ca-widget-container

2.2) This is the result:

OPTION 2: To control the place of the review:

  1. Add a “Code Widget” bric:

  1. Press in the widget and it will open the code box and type the following:
<div class="center" id="ca-widget-container">
</div>
<style>
.center {
   position: absolute;
   top: 90%;
   left: 65%;
   }
</style>

And the result will be this:

Hope it could help you :wink::upside_down_face::wink:

That’s what I’ve been looking for. Thank you very much for your help! :+1: