Create Localized Content With Content Swaps
This article is for Account Owners and Project Managers
Sometimes translation isn’t enough, and you may want to completely replace a section of content on a specific translated site. There are three basic ways to swap out content in the Global Delivery Network (GDN).
For example, if you need to display a different set of Social Media icons on each translated version of your site compared to what is displayed on your English site.
- Mark up an HTML element with the Swap Class (sl_swap).
- Take advantage of automatic image/flash/binary file swaps by using a predefined folder structure.
- Use language-specific CSS.
If you are looking to hide an element from appearing on all translated sites, see our article on Hiding content.
Content swaps are provided as a convenient way to manage small amounts of localized content that appear within a page. If you have a significant number if instances where you need to display localized content or if you need to serve an entirely different page layout entirely, consider implementing server-side logic to serve appropriate resources based on HTTP request headers.
Sometimes you want to use content on a localized site that isn’t ‘translated’, just different. For example, you may want to substitute the address of your local office in a particular country, or you may want to replace a customer testimonial from a US customer with one from a Spanish customer. You can achieve this using the ‘sl_swap’ class. First you need to tag the content that you want to swap out.
For a swap to work, the element MUST have a unique ID. Additionally, the Swap class cannot be nested.
<div class="testimonial sl_swap" id="testimonial1"> <img src="/images/testimonials/greg.png"> <p>I used this product and joy returned to my life!</p> </div>
You will need to make sure you have captured your source content by browsing to that page on one of your translated sites. Then you can add your localized content in the Smartling Dashboard.
- Do one of the following:
- In the New Experience, go to the gear icon > Project Settings > Content Swaps and select a language.
- In the Classic Experience, go to Global Delivery Network > Content Swaps and select a language.
- Find your content by ID, and write your alternative content in the box marked Localized Content.
- If you don’t need to translate your localized content - our local testimonial, for example, is already in the correct language - check the Do not translate box.
- Click Save.
If you do need to translate your swapped content, you will need to browse to the translated page again to capture it for translation.
If you repeat your source content in your swap for some languages, remember that they will not automatically change if you alter the source content.
Content Swap Tips
- Make sure you check that your swapped content displays as expected on your translated sites.
- To avoid overloading existing elements, you can always surround them with a tag and use that to hold the sl_swap class and unique id.
- Be aware that using sl_swap on an inline tag will cause Smartling to treat it as a block tag. This may cause unexpected results. So use a block tag where possible and be sure to check that the resulting content displays as expected.
Content Swaps in the Head
Content swaps also work on <title> and <meta> elements in the head of the page:
<!-- SL:swap-start:id:/page/html.html-keywords --> <meta name="keywords" content="Paris, reservation, hotel"> <!-- SL:swap-end -->
If you tag meta keywords for swapping, Smartling will treat the swapped content as a comma-separated list.