Language switcher editors | Community Development | Sandbox ConnAct

En en NL content in any editor section to sync with language selection:

<div class="language-dutch"> content in between </div>

<div class="language-english"> content in between </div> 

header homepage

<div class="language-english"><img alt="Banner EN" height="380" src="/Assets/Uploaded-CMS-Files/08550c3d-02b7-45ef-83cc-a56719ddc762.png" width="1500" /></div>
<div class="language-dutch"><img alt="banner" height="380" src="/Assets/Uploaded-CMS-Files/c261be81-331f-4d33-92a4-834803e99074.png" width="1500" /></div>

Full wide Ifram with Dutch and UK website link

<div class="language-dutch"><iframe width="100%" height="900" style="overflow: hidden; height: 900; width: 100%;" src="https://appshop.transportlab.org/app-shop-overzicht/" frameborder="0"></iframe></div>

<div class="language-english"><iframe width="100%" height="900" style="overflow: hidden; height: 900; width: 100%;" src="https://appshop.transportlab.org/en/app-shop-overview/" frameborder="0"></iframe></div>

 

Axero container with text and image content

<div class="axero-widget">
<div class="axero-widget-header" style="color: #003366;">
<h5>App Shop</h5>
</div>
<div class="axero-widget-content" style="padding: 15px;">
<p></p>
<div class="language-dutch">
<p><img alt="" height="47" src="/Assets/Uploaded-CMS-Files/c9f0b3bf-49ab-49ab-8316-618881a5e83b.png" width="47" /><a href="/spaces/9/transportlab-community/about/transportlab-appshop-full-screen">&nbsp; Volledig Scherm</a></p>
<h4><span style="color: #ff6600;">Apps&nbsp;voor&nbsp;transport, logistiek&nbsp;en mobiliteit!</span></h4>
<h4><span style="color: #ff6600;"><img alt="" height="721" src="/Assets/Uploaded-CMS-Files/2154d7c0-ea54-4efc-9505-f7c64e5b7548.png" width="600" /></span></h4>
</div>
<div class="language-english">
<p><img alt="" height="47" src="/Assets/Uploaded-CMS-Files/c9f0b3bf-49ab-49ab-8316-618881a5e83b.png" width="47" /><a href="/spaces/9/transportlab-community/about/transportlab-appshop-full-screen">&nbsp; View Full Screen</a></p>
<h4><span style="color: #ff6600;">Apps for transport, logistics and mobility!</span></h4>
<h4><span style="color: #ff6600;"><img alt="" height="721" src="/Assets/Uploaded-CMS-Files/c6792757-d72a-4a51-8faf-ccfb44d21916.png" width="600" /></span></h4>
</div>
</div>
</div>

If needed

Also add to bottom of cms page:

<script type="text/javascript"> $(function () { var langCookie = $.cookie("Communifire_UserCulture"); var lang; if(langCookie == 'nl-NL') { lang = '.language-dutch'; } else { lang = '.language-english'; } $(lang).addClass('chosen-language'); }); </script>