Follow

How do I customize the appearance of my banners?

There are a number of query string parameters to manually customize the appearance of your banners.

Widget list

In the examples above, we've outlined a manual mapping mode where widgets can be retrieved manually by their Widget ID. If the banner in question features multiple videos, you may list the widgets you exactly want with a comma separated string using the widget_list parameter.

Example:

<script type="text/javascript" src="http://sv.liveclicker.net/service
/getComponent?client_id=31&component_id=219&dim1=&dim2=&dim3=&widget_list=973,1252,234"
></script>

This method is not recommended. A best way to do this is to create a banner with a playlist attached. With a playlist, you can edit the widgets to feature remotely, at any time, and without code changes.

Conditional rendering

In some cases, you may already be serving videos on your product pages and only want to feature a video from the Liveclicker system if there is no video available from your own system. The best way to accomplish this is to tag all your product pages with the proper Liveclicker tag, then make use of the liveclicker_no_display JavaScript variable when you want to omit Liveclicker.

Example:

  • There is already a video and you want to omit Liveclicker:
<script type="text/javascript">var liveclicker_no_display = 1;</script>
<script type="text/javascript" src="http://edge.liveclicker.net/scripts/
getComponentOnload.js?client_id=31&component_id=219&dim1=&dim2=nike&dim3="
></script>

 

  • There is no video available from your own system and you want to default to Liveclicker:
<script type="text/javascript" src="http://edge.liveclicker.net/scripts/
getComponentOnload.js?client_id=31&component_id=219&dim1=&dim2=nike&dim3="
></script>

(Notice the absence of the liveclicker_no_display variable)

NOTE: this method only works for banners loading after the onload event (using GetComponentOnload.js)

Banner height and width

For banners loading after the onload event, it may be useful to make sure the banner content doesn't change your page layout when rendering: in some cases, if there is no video content to show, the video banner will come out empty. When that happens, if you want to avoid page redraws, it's good to specify a banner height and width to force the browser to allocate a fixed space for the video banner, whether this a content or not.

Example:

<script type="text/javascript" src="http://edge.liveclicker.net/scripts/
getComponentOnload.js?client_id=31&component_id=219&dim1=&dim2=nike&dim3=&bannerheight=120&bannerwidth=160"
>
</script>

HTML-only, static scenario

This is the absolute worst case scenario because it requires manual intervention for each video. Here, the banner is inserted as a straight HTML link on page. This method is limiting, because you will have to manually copy/paste this code for each of your video widgets, but it will work in environments where your CMS doesn't allow JavaScript scripting code.

<a href="http://vms.liveclicker.com/component/overlaycontent.php?widgetid=<MANUALLY_INSERT_YOUR_WIDGET_ID>
&aid=19&overlay_type=4&component_id=134" onClick="javascript:window.open('','lc_134','toolbar=no,location=no,
status=no,menubar=no,scrollbars=yes,resizable=yes,width=380,height=330');
return true;" target="lc_134">View video</a>

Notice the following:

  • <MANUALLY_INSERT_YOUR_WIDGET_ID> is where you insert the widget ID manually
  • In the above, lc_134 and 134 are references to the banner ID in Liveclicker. 19 is the client ID. These are only created once per banner and will not change over time.

Basic and Basic Plus Player

The Liveclicker Player can be dynamically changed to hide the "Buy Now" and "Share" buttons when delivered via a banner. To enable these special modes, simply add a basic_plus_player=true or basic_player=true parameter to the query string in the banner call:

<script type="text/javascript" src="http://sv.liveclicker.net/service
/getComponent?client_id=<CLIENT_ID>&component_id=<COMPONENT_ID>&widget_id=<WIDGET_ID>&basic_plus_player=true"
>
</script>
  • The Basic version of the player, set when basic_player=true, turns off ALL sharing and buy now controls
  • The Basic Plus version of the player, set when basic_plus_player =true, hides both the buy now button

Custom Player

If you have defined your own custom player, the The Liveclicker Player can also be dynamically changed to use that player. Simply add a player_custom_id parameter to the query string:

<script type="text/javascript" src="http://sv.liveclicker.net/service
/getComponent?client_id=<CLIENT_ID>&component_id=<COMPONENT_ID>&widget_id=<WIDGET_ID>&player_custom_id=<PLAYER_ID>"
>
</script>
  • The PLAYER_ID is the id assigned to the player when you create it.

Overriding the Image in Static Button Banners

If you have defined a static button banner, the button image displayed can be dynamically changed to show a different image. Add an image_url parameter to the query string, with the value of the image URL, in URL-encoded form. If you would also like a different button image to be displayed when the mouse rolls over the link, pass it as image_url_mouseover (though you can have an image_url without an image_url_mouseover):

<script type="text/javascript" src="http://sv.liveclicker.net/service
/getComponent?client_id=<CLIENT_ID>&component_id=<COMPONENT_ID>
&image_url=<URL_ENCODED IMAGE_URL>&image_url_mouseover=<URL_ENCODED_IMAGE_URL>"
>
</script>
  • This works with both getComponent and getComponentOnload
  • You will most likely need to adjust the other parameters such as bannerwidth and bannerheight if the image is a different size.

Example:

<script type="text/javascript" src="http://edge.liveclicker.net/scripts/getComponentOnload.js?
client_id=19&component_id=123&widget_id=456&bannerwidth=384&bannerheight=145
&image_url=http%3a%2f%2fedge.liveclicker.net%2fimages%2fclient%2f19%2fimageassets%2fimage51"
>
</script>

Overriding the order of results

If you have selected to display a banner with video thumbnails, you can dynamically change the order of the results on a particular page without affecting the global ordering setting you chose when creating the banner. To do so, you can make use of the force_component_order_type query string parameter:

The values of force_component_order_type are:

  • 0: popular (widget rating/views in decreasing order)
  • 1: views (widget views in decreasing order)
  • 2: latest (widget modification date in decreasing order)
  • 3: relatedness (only applies to contextual matches, search engine "score" in decreasing order)

In general, you will be most interested in 1 and 2. In the absence of this &force_component_order_type parameter, ordering is controlled via the Liveclicker UI.

<script type="text/javascript" src="http://edge.liveclicker.net/scripts
/getComponentOnload.js?client_id=19&component_id=123&widget_id=456&bannerwidth=384&bannerheight=145
&force_component_order_type=1"
>
</script>

Extra Result Prioritization

The ordering criteria described above do not always allow full control of what users will see. In some cases, you may want to give priority to certain types of content that would otherwise not rank high when ordered by the selected setting. A common example of this would be to create a banner that would filter out content specific to a brand and order by popularity - but always placing the official branding videos on top.

To accomplish this, you need to leverage dimensional tagging to prioritize widgets over their natural order. Say for example you want to promote your videos tagged as "ads" for dimension 3. Then you need to enter "dim3=ads" in the Extra Prioritization field for your banner configuration.

This technique requires impeccable tagging of videos. In particular, you would need to make sure that every tag has dimension 3 set as "ads" for this feature to work in a reliable fashion.

Extrapriotization.png

Leaving the above as blank will cancel out any form of extra prioritization.

Default widgets for auto match types

For automatic video match types, you can add a list of comma separated widget IDs which will always appear (example: 4235,3532). When the onsite banner is rendered, these widgets will be added *after* any matches. This can be useful for example on a brand page, where in the absence of widgets matching a brand you want to display more generic video content instead of not showing anything.

DefaultPlaylist.png

Leaving the above as blank will remove any additional default widgets.
This only applies to auto match types.

JavaScript Plugins

JavaScript Plugins can be added to the overlay content to modify the experience within the overlay. Such JavaScripts are rendered within the overlay iFrame and do not affect your site content. Currently only wide modals are supported. For more information visit the JavaScript Plugins Section.

Automatically Triggering the Banner overlay on Page Load

If you need to automatically start an overlay banner on a given page, simply add the following to your URL query string: &overlay_autostart=true (or ?overlay_autostart=true if there are no query string parameters for this page). This is useful for landing pages - note in the absence of this additional query string parameter the overlay never autostarts.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

0 Comments

Please sign in to leave a comment.