4. Editor: Content

The campaign editor fills the back-office page below the PrestaShop header, next to the menu; Campaigns at its top left takes you back to the list. The ⤢ button in the editor header switches to full screen (Esc or the same button returns); the ? button replays a short tour of the editor, which also opens once on your first visit. It has four tabs on the left – Content, Design, Where & who and When – and the live preview of your store on the right.

1. The four steps with ✓ and a one-line summary
2. Campaign name (only you see it)
3. Language of the texts
4. Tour (?) and full screen
5. Save changes / Review and publish
6. Preview: device and page

At the top of the editor you find:

• Campaigns – back to the campaign list. If you have unsaved changes, the editor asks Leave without saving? first.
• Campaign name (only you see it) – the internal name shown in the campaign list. Shoppers never see it.
• The status of the campaign, the same as in the campaign list: Draft, Active, Scheduled, Ended or Paused. It describes the saved campaign in the shop's time, not your unsaved changes.
• Next to the buttons, the save status in grey text: Unsaved changes, Saving… or All changes saved.
• Language of the texts – the language you are editing (only in stores with more than one language).
• The buttons Discard changes, Save draft and Review and publish (or Save changes for a published campaign). See Review and publish. Discard changes asks once more (Discard all changes?) before it drops your edits.

The four tabs work as steps. Each shows a number in a circle, a check mark ✓ when the step is fine, or a red ! when something needs fixing, and under its name a one-line summary of what is set (for example Sides + Bar, Graphite, All pages, Always). You see the whole campaign at a glance without opening every tab.

Options that most campaigns never change are collapsed under More options (or a similar heading). When collapsed, the heading lists what you changed there, so nothing is hidden without a trace. The ⓘ buttons next to many settings open a short explanation.

The tour opens the first time you open the editor and is remembered with your employee account, so it does not come back on another computer or browser. The ? button at the top of the editor (Show the tour) plays it again whenever you like.

#Where on the page

Each campaign has three placements. Switch on the ones you want.

Placement	What shoppers see
Left side	Tall banner left of the content
Right side	Tall banner right of the content
Bar	Slim bar at the top or bottom, on phones and wherever side banners do not fit

Side banners appear on wide screens next to your content, the bar on phones and narrow screens. When is the bar shown?

• Phones always get the bar.
• Campaign with side banners: on larger screens the bar appears only where the side banners do not fit, and only when Show the bar where side banners do not fit is ticked under Content > More options (it is by default).
• Campaign without side banners: the bar follows Also on computers and tablets.

Tip: keep the bar switched on, otherwise laptop and phone users may see nothing. With every placement switched off, the tab shows a warning: the campaign would show nothing.

Under the cards the editor also shows where the side banners sit, for example "All campaigns: 200 px from the top · Stay visible (sticky)". The distance from the top and the scrolling behaviour depend on your theme header, so they are the same for all campaigns; Change in Settings opens Display settings, where a preview shows every change.

1. A placement with a picture of its position and a switch
2. Top or Bottom for the bar
3. What the banners show: Designed or Own image

Each placement card shows a small picture of the page with the banner's position. For the Bar choose Top or Bottom:

• Top: the bar becomes part of the page above your theme header, across the full width. It never covers the logo, menu or cart, and scrolls away with the page. It is in place from the first moment the page shows, so the page never jumps down when the bar appears.
  • Stays at the top while scrolling (under Top): the bar sticks to the top of the window instead of scrolling away. A header of your theme that stays on screen (for example in Hummingbird) moves below the bar, so neither covers the other. Closing the bar puts the header back.
• Bottom: the bar stays fixed at the bottom of the screen. The module adds space below the page so nothing is hidden behind it.

Width of the bar sets how the bar looks:

• Full width (default): the bar runs from one edge of the window to the other.
• Floating: the bar is a rounded card with a soft shadow and space around it, at most 760 px wide and centred. At the top it sits above your header with a small gap; at the bottom it floats over the page. On phones the space around it is smaller. Everything else works the same: Stays at the top while scrolling, closing, the countdown, the progress bar and the scrolling line.

1. Width of the bar: Full width or Floating
2. The preview on a phone: the floating bar at the bottom, here with the messages as one scrolling line

Under the cards, What the banners show chooses the content for all placements at once:

• Designed – a banner built from your texts and colours.
• Own image – an image you upload.

More options (collapsed) holds what few campaigns need:

• Same as the left side (when both sides are on, ticked by default): the right banner shows exactly the same as the left one, so you edit the content once. Untick it to give the right side its own content.
• Content per placement: a different content type for each placement, for example designed side banners and an image in the bar. What the banners show then says the placements are mixed.
• Also on computers and tablets (bar only, when both side banners are off): the campaign has no side banners, so the bar can run as an announcement bar on every screen. Untick it to keep the bar on phones only. It is on for new campaigns.
• Show the bar where side banners do not fit (side banners and the bar both on, ticked by default): small laptops and tablets often have no room next to your content, so the bar takes the place of the side banners there. Untick it to show nothing on those screens, for example for a campaign that makes sense only as a tall image.

Clicking a placement card also highlights that banner in the preview, and clicking a banner in the preview selects its card.

#Texts

The Texts section appears when at least one placement uses Designed. The texts apply to all designed placements, in the language selected at the top. No field is required on its own: a designed banner needs at least one of the headline, supporting text, discount code, button or a running countdown.

Field	Notes
Headline	Keep it short: a counter warns above 40 characters. Example: "Black Friday −30 %". You can type a normal hyphen: the store shows "-30 %" with a real minus sign and keeps the % sign on the same line as the number.
Supporting text (optional)	One line of detail. A counter warns above 80 characters.
Discount code (optional)	Shoppers copy it with one click. Letters are turned to capitals, accented letters are kept; spaces, angle brackets, curly braces, quotes and backticks are removed automatically. Type a code of a cart rule from Catalog > Discounts, or take the code from the discount directly, see Discount codes from your discounts.
Button (optional)	Text of the button, for example "Shop now". A counter warns above 24 characters.
Link	Where the banner leads. See Links below. Optional for a banner without a button; with a button text it is needed.
When the amount is reached (optional)	Appears when a text contains {remaining}, see Amount to free shipping.

1. Headline with a character counter
2. Discount code
3. Link to a page of your store

How the button behaves:

• Button text and link: a clickable button with your text.
• Link but no button text: a clickable button with the text "Shop now" (translated with your store).
• Button text but no link: shoppers would see a button that goes nowhere. The Link field then says "The button needs a link", the Content tab shows a red !, and the review does not let you publish until you pick a page or clear the button text. Drafts can be saved this way. The templates come with a button text, so pick the link before publishing.

#Messages that take turns

Under the supporting text, Add a message that takes turns adds a second message (a headline and a supporting text), and once more a third. The messages alternate in the same banner with a soft fade:

• Messages change every: 3, 5 or 8 seconds.
• The banner keeps the height of the longest message, so nothing on the page moves when they change.
• The messages pause while the shopper points at or tabs into the banner. With reduced motion switched on in the device, only the first message shows.
• Messages are per language, like the other texts. Remove this message deletes one.
• {remaining} works in every message.

#One scrolling line in the bar

When the campaign uses the Bar, In the bar appears under the messages:

• Take turns (default): the messages alternate, as described above.
• Scroll in one line: the headline and the messages run through the bar as one continuous line, like a news ticker. Speed is Fast, Normal or Slow.

Good to know:

• The line has a small pause button, and it also stops while the shopper points at it or tabs into it.
• With reduced motion switched on in the device the line stands still and shows the first message.
• Only the bar scrolls. Side banners of the same campaign keep taking turns.
• The bar keeps its height, so nothing on the page moves.

#Images

The Images section appears when at least one placement uses Own image. Each placement has its own image, per language.

1. Drop an image on the field or click it to choose a file (Drop an image here or click to choose). You can also click Choose from the library to reuse an uploaded image.
2. Fill in Description for screen readers: describe what the image says, for example "Black Friday, 30 % off everything". Shoppers using a screen reader hear this text instead of seeing the image. The review warns you when a description is missing.
3. Optionally add a Link.

Accepted files: JPG, PNG, WebP, GIF or SVG up to 5 MB, or less if your server's upload limit is lower (the field shows the actual limit). Large photos are scaled down in your browser before the upload, so uploads stay fast.

Placement	Recommended size	Shape
Left side / Right side	320 × 1200 px	Tall (about 1 : 3.75)
Bar	1280 × 200 px	Wide (about 6.4 : 1)

After the upload the editor rates the image:

Label	Meaning
Fits	The shape fits the placement.
Cropped	A bit taller or wider than the placement: the edges may be cut.
Other shape	A different shape (for example a bar image in a side placement): it shows very small or strongly cropped. Use an image made for this placement.

If an image is narrower than the placement, you also see "The image is smaller than the placement and may look blurry."

1. The image with its rating: Fits, Cropped or Other shape
2. Description for screen readers

#Keep visible when cropped

Side banners never run past the bottom of the window, and the bar never takes more than a quarter of a phone screen (at most 160 px high). Taller images are cropped. When an image will be cropped, Keep visible when cropped appears under it: choose which part stays, Top, Middle or Bottom (small pictures show the visible part).

Use Replace to pick another image or Remove image to clear the field. Removing an image from a campaign does not delete it from the media library.

#Links

The Link field accepts two kinds of targets.

A page of your store (recommended). Type at least two letters of a product, category or CMS page name. Suggestions appear under Pages of your store; pick one with the mouse or the arrow keys and Enter. The field then shows the page type and name.

• The link follows the shopper's language: a shopper browsing in German lands on the German product page.
• If the page is later deleted or disabled, shoppers simply get no link, and the editor shows "This page no longer exists or is disabled. Shoppers get no link. Pick another page."
• Click Remove the link (the × on the right) to clear it.

A typed address. Type an address that starts with / (a page of your store, for example /content/1-delivery) or with https:// (any website). Anything else is refused with "Type an address that starts with / (a page of your store) or https://, or pick a page from the list." The same error appears when you save an address the shop cannot store, for example one containing [, ] or ;. Addresses with accented letters, such as https://shop.sk/kategória, are fine.

Typed addresses are stored per language, so you can enter a different address in each language.

#Discount codes from your discounts

Instead of typing the code, click Take the code from a discount under the Discount code field and search a discount of Catalog > Discounts (cart rule) by its name or code. Only discounts with a code are listed, each with its validity.

1. The linked discount: its code, name and validity, with Open the discount
2. Apply button
3. Personal code with a time limit

Once linked:

• The code is the same in every language and always matches the discount. Change picks another discount, Type a code instead removes the link and lets you type again.
• The campaign shows only while the discount works. When it is switched off, has not started, has expired, is used up or does not apply to the shop, the campaign disappears by itself (no banner with a dead code); the card in the editor and the review say why.
• If the campaign has no end date or ends later, its end is set to the end of the discount ("The campaign now ends with the discount: …"), so a countdown counts down to it. You can still change the dates in When.

Apply button adds an Apply button next to the code. Shoppers add the discount to their cart with one click. The button uses PrestaShop's own voucher form of the cart page, so every condition of the discount is checked by PrestaShop (minimum amount, customer groups, combinations with other discounts, other modules). An empty cart gets "Add a product to your cart first."; an error of PrestaShop is shown under the button; a successful one shows ✓ Applied and refreshes the cart.

Personal code with a time limit (15 min, 30 min, 1 hour or 24 hours) turns the code into Get my code. Each shopper who clicks gets an own code: a copy of the discount for one use, with the same reduction and conditions, valid for the chosen time. The banner shows the code, "Valid for 14:52" counting down, and the Apply button if switched on.

• The urgency is real: the code stops working when the time is up. This keeps the countdown honest, which matters in the EU (a countdown that restarts for every visit is a misleading practice).
• One code per shopper and campaign: the same code comes back on every page; when it has ended, the banner says "Your code has ended." and no new code is offered.
• A personal code never lasts longer than the discount itself. Unused codes are deleted a day after they end; codes used in an order stay for the order history. At most 500 codes per campaign and hour are made, and none for bots.
• The codes appear in Catalog > Discounts with the description sab-personal: and the campaign number.

#Amount to free shipping

Write {remaining} in the headline, supporting text, button or a message, for example "Add {remaining} for free shipping". The banner shows the amount the cart still needs:

• to the Cart value under limit of the campaign (Where & who > Audience and conditions), if set;
• otherwise to the free shipping of your shop. The module looks for it in three places and you do not have to type the amount anywhere:

Where free shipping is set	What the module reads
Shipping > Preferences	Free shipping starts at (a price).
Catalog > Discounts	An automatic discount (without a code) with Free shipping and a Minimum amount, valid for the shopper's shop, country, customer group and carrier. Discounts with a code, or limited to certain products, are left out: the banner cannot promise them.
Shipping > Carriers	The price ranges of the carrier: the cart value from which shipping costs nothing in the zone of the shopper's country. Used for carriers billed by price, without a handling fee.

When more than one applies, the nearest one wins: the one with the smallest amount still missing. Each is counted the way PrestaShop grants it (with or without tax, with discounts, without shipping), so the banner and the checkout agree. The amount is shown in the shopper's currency.

Under the texts the editor tells you which one it found, for example "{remaining} counts to free shipping from 50,00 € (Shipping > Preferences)", or the name of the discount or carrier. The editor shows the amount of a new visitor from your default country; shoppers in other countries or groups, or with another carrier, see the amount of their own free shipping.

The amount updates without a page reload when the shopper adds a product to the cart. Without either limit, {remaining} would show nothing: the Content tab shows a red ! and the review does not let you publish.

When the amount is reached (optional, for example "You have free shipping!") replaces the headline and hides the supporting text once the cart reaches the amount; below the amount again, the texts come back. The text block keeps its height, so a bar at the top does not move the page. The Free shipping template comes with this text in seven languages.

#Progress bar

Progress bar adds a thin line along the bottom of the banner that fills up as the cart gets closer to the amount, and is full once it is reached. The checkbox appears when the campaign has an amount to count to (a Cart value under limit or free shipping found in your shop).

• It updates together with the amount when the shopper adds a product to the cart, without a page reload.
• It takes no room of its own, so nothing on the page moves.
• It uses the accent colour of the style (the colour of the button), so it fits every design.

1. Progress bar: the line along the bottom of the banners in the preview
2. When the amount is reached

#Languages

Texts, images, descriptions, links and countdown texts are stored per language. Switch the language with the buttons at the top of the editor (or the drop-down menu in stores with more than six languages).

A language is incomplete when a switched-on placement has nothing to show in it: no text, code, button or running countdown for a designed banner, or no image for an own-image banner. Shoppers browsing in that language do not see the campaign at all. The editor marks such languages with a dot and shows a notice with a Copy from … button that copies all texts, links and images from a complete language, so you only need to translate.

#A/B test

At the bottom of the Content tab, A/B test lets you find out which version of a designed banner sells better.

1. Test a second version with the texts and style of version B
2. Show in the preview: Version A or Version B
3. Results: views, clicks, orders and revenue of each version

How it works:

• Switch on Test a second version and write the Headline of B, Supporting text of B and Button of B. Empty fields use the text of A, so you can test only the headline. Style of B can be Same as A or another style of the gallery.
• Half of the shoppers see version B, the other half version A. Each shopper keeps the same version on every page and visit. The version is picked in the browser before the banner is drawn, so the page does not flicker or jump, and the test works with page cache.
• Banners with your own images are not tested; they show the same image to everyone.
• The test starts when you save the campaign. The section then shows the Views, Clicks, Orders and Revenue of each version since the start. An order counts for the version the shopper saw, when placed within 7 days after seeing the banner.
• Until each version has at least 100 views, the section says it is collecting data. Then it compares the versions (a statistical test at 95 % confidence): by clicks until there are 20 orders, then by orders. "Version B gets 18 % more clicks, and the difference is clear" means you can decide; "is ahead …, but it is not certain yet" means let the test run longer.
• Keep A and end the test or Keep B and end the test finishes the test. Keeping B copies its texts and style into the campaign. Save your other changes first.

---