Превод на постове

От български към английски и обратно

Много елементи в този сайт са на два езика. Бутони, страници, абзаци… Превеждам ги по най-лесния начин – пиша ги на български и на английски. Ако няма да добавям повече преводи, мисля че е приемливо да използвам този лесен, но не много красив метод. Ако някой разглежда страницата, ще вижда текст и на двата езика.

Но при постовете като този не исках да ползвам същия метод. Трябва да разделям българския от английския текст по някакъв начин. Ако просто пиша единия под другия, тогава трябва четящия да търси своя език по-надолу в страницата. Ако ги разделя на две колони, тогава става неприятно за четене, особено на мобилни устройства, където текстът би бил прекалено тесен. Ако направя разтварящи се менюта, където текстът може да се показва и скрива с кликане, е малко по-добре, но пак всичко е на една страница.

Затова реших да направя два варианта на всеки пост – един на български и един на английски. В началото на им ще има линк, който да праща към другия вариант на поста. Но би било много досадно, ако трябваше ръчно да добавям линк всеки път. За щастие в Publii има опция за добавяне на персонализиран HTML към началото или края на всяка страница или пост. Затова можех просто да отида в Tools and Plugins > Custom HTML > Before every post и да добавя следното:

<p class="msg msg--info" id="langlink"><a href="">Натиснете тук</a></p>

Но не е толкова лесно – все пак линкът е различен за всеки пост. Трябваше да напиша и малко JavaScript, за да задам URL адреса според текущия адрес на страницата.

<script>
    // Взимаме текущия URL адрес
    var currentURL = window.location.href;
   // Станици, чиито адрес завършва с "-2" са копия и следователно на английски
    if(currentURL.slice(-3)=="-2/") {
        // Премахваме "-2" от адреса за да отидем на българската страница
    	document.getElementById("langlink").innerHTML = 
    "<a href=\"" + currentURL.replace("-2/", "/") + "\">Натиснете тук</a>, за да видите поста на български.";
    } else {
        // Добавяме "-2" към адреса за да отидем на английската страница
    	document.getElementById("langlink").innerHTML = "<a href=\"" + currentURL.replace(/.$/, "") + "-2/" + "\">Click here</a> to view this post in English.";
    }
</script>

Не е много изпипано, но върши работа. Стига да спазвам същите конвенции за адреса на страниците, би трябвало да няма проблем.