Skip to main content
FAQ: Dialogues
Updated this week

Why can't I edit my position inline?

The inline editor in BlueConic does not work for every position, and it is possible that the Visual Picker came up with a position selector that cannot be edited by the editor.

For example, in the screenshot below, a position was picked:

The position path for the Visual Picker is in this case:

body > div > div > div > div > div > div > div > div > div > div > a > img

This path ends with an "img" tag. This "img" tag cannot be edited with the inline editor, so even though this selection results in a perfectly legal selector, the path is not suitable for an inline editing position.

This can be resolved by picking another tag from the position path shown above the page. When you hover over the path, a popup window with more information appears, and a red outline shows what the selection would encompass on the page.

In our example, the tag before "img" is an "a" tag. This tag also cannot be edited in the inline editor, so we choose the tag before that, the "div".

How do I use the Visual Picker with HTML images in BlueConic?

The path is now:

body > div > div > div > div > div > div > div > div > div > div

Click "Test" to see if this selection covers the correct area, and if it does, click "Use this position."

Now the position can be edited inline.

Tags that work with the inline editor:

  • address

  • article

  • aside

  • blockquote

  • body

  • details

  • div

  • fieldset

  • figcaption

  • footer

  • form

  • h1

  • h2

  • h3

  • h4

  • h5

  • h6

  • header

  • hgroup

  • nav

  • p

  • pre

  • section

Why does the design of the position break after I click 'Pick and Edit'?

The inline HTML editor in BlueConic can be picky about the content it is editing. If the content contains invalid HTML (e.g., nested header tags or empty i tags), the editor will correct the bits it considers to be wrong. This correction can result in a different design of the position.

If you notice this happening:

  1. Reload the Dialogue by navigating to it again. Do not save the changes when asked to.

  2. To the right of the Pick and Edit button is a selection arrow. Click it, and you can choose the option Open in HTML editor.

How do I use the HTML editor in the best-in-class BlueConic customer data platform (CDP)?

Now you should be able to edit the HTML source without disrupting its structure. This will leave the design intact.

How do I edit HTML source code in the BlueConic customer data platform (CDP)?

Save your Dialogue when ready.

Why can't I edit and change my background image?

In order to be able to edit an image, it has to be part of the HTML source of the position you are editing. For example, with the help of CSS, images can be shown where the actual HTML source does not contain an image.

You can edit the HTML source of the position to see if anything is going on using the HTML editor.

For example, if the HTML looks like this and you can only edit the text, then the class "background-image" makes the image appear behind the text:

<div> <div class="background-image"> <img src="/images/background.jpg" /> </div> <div class="text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. </div> </div>

In the above example, if you want to change the actual image, change the "src" attribute of the "img" tag to the URL of another image. Just make sure the URL of the image is publicly accessible, in other words, the image has to be uploaded to a public website.

Sometimes the HTML source does not even have an "img" tag at all:

<div class="background-image">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>

In this case, the image is delivered via the CSS class "background-image", and the URL for the image is part of the style sheet itself. BlueConic cannot edit the style sheet itself, so in this case there is no way to edit the image.

To summarize:

  • If you cannot edit an image with the inline editor, try the HTML editor.

  • In the HTML editor you cannot upload an image, so you will have to use the URL of an existing image.

  • If the HTML editor does not contain an image URL to edit, the image is likely served via CSS and cannot be edited.

How can I use the Shortened URL feature and track conversions?

Note that if you create a link using the “shortened URL” option that does not track conversions, you should check the link HTML to ensure that the following classes exist:

  • data-bc-shortenedurl

  • data-bc-shortenedurl-id

  • data-bc-shortenedurl-target

If these classes are missing, BlueConic will not be able to appropriately track clicks and conversions.

To enable BlueConic to track clicks and conversions for a shortened URL,you can temporarily unlink the target location and recreate the URL redirect using the link in the toolbar. Do not click “Save” yet.

You can then copy and paste the classes listed above, refresh the page, and add them to your original HTML. This will enable BlueConic to begin tracking clicks and conversions for your URL.

How can listen to form input? Nothing seems to be happening.

First, make sure that the form is actually part of the page and not hosted in an iframe. If the form is hosted in an iframe, then the only way to enrich the profile based on the visitor's input is to have the BlueConic script placed in the iframe as well.

Another important aspect to consider is how the form is handled by the site. Traditionally, forms are submitted using the HTML DOM form submit, which for example is triggered by clicking a 'submit button'. A lot of websites choose to prevent the default submit event and handle the form programmatically -- for example, by triggering an AJAX request to send the input data to the server and not have the page reloaded completely. The rules of the Form Listener need to be configured to fit the way the form is handled by the site.

Finally, there is the way the form is initially loaded into the page. Traditionally, the form is just part of the HTML body of the page. Some sites, however, especially sites that embrace the Single Page Interface model, choose to load the form dynamically, after the HTML body has loaded.

If you are not sure how the site is handling or loading the form, try the different rule variations to find the variation the works for you.

The different listen rule variations are:

  • Write data to a profile property when the surrounding form is submitted
    This corresponds to the traditional way of submitting and loading forms.

  • Write data to a profile property when a custom form is submitted
    This also corresponds to the traditional way of submitting forms but lets you manually choose the form. Whenever the form is dynamically inserted into the page this should be the first variation to try.

  • Write data to a profile property when a custom defined form is submitted
    This variation should be used when the fields are not located inside the form that is programmatically submitted by the site. Either manually choose the position on the website or use the visual picker to select the form.

  • Write data to a profile property when a custom position is clicked
    This variation should be used when the form submit is handled programmatically by the site. You manually choose the position on the website, which after it is clicked should trigger a profile update.

  • Write data to a profile property when the location hash changes
    This variation should be used when the form submit is handled programmatically by the site and the URL in the browser is appended with a specific hash (e.g. "#success") as a result. Enter the hash name without the "#" so BlueConic can determine a successful submit has taken place.

how do collect customer data from input forms in BlueConic?

Did this answer your question?