Translating text without plugin – wordpress

Translating text (string) without plugin from a multi-language wordpress website and how to make it appear only on homepage

In this post we’ll show you how to make your wordpress show a static text on front-page and how to translate that text in every language on your site.

We need:
– WordPress multilangual (bilingual)- used for translating text
Poedit free version
– FTP access ( so we can modify and upload files )
Notepad Plus Plus for easy editing (automated line numbering)

What we use:
– twentyfourteen theme (where you’ll see a path/line that contains twentyfourteen word please replace it with your active theme word)
– romainan website is in root, in our case sfaturiit.ro
– english website is installed to sfaturiit.ro/en/
– romanian website has romanian language as default in settings/general (from wordpress admin)
– Active theme has a languages folder that contains 3 files: ro_RO.mo / ro_RO.po / twentyfourteen.pot (it’s ok to only have ro_RO.po)

Attention:
-Please do a back-up of every file you modify. If website is empty after you made your modifications it means that you left a php open or some “. We are not responsible for your data loss.
-These modification will be lost after a theme update. They need to be written in a custom plugin (will discuss in a future post how to make your own plugin)

First of all why we need static content on our front page, why not leave only dynamic content?

On homepage we need static content because is better from search engine optimization perspective. Dynamic content is good but we need few static lines in case that robots don’t take into consideration meta description that we placed.

Placing our text on front-page

Most wordpress themes have a header file, a footer file and more files for content (one for pages, one for post, one for image post etc.)

Translating text
Translating text without plugin header,footer,content

Because we want our info to appear before posts but under header, we choose to modify index.php file(you may need to modify other file, depending on your theme). We found this file in /public_html/wp-content/themes/twentyfourteen

Open file with notepad++ and we pay attention at line number on which code needs to be modified.

After this line of code:

We place our text to be translated(before post loop):
We verify if we’re on front-page/homepage

If so we make a css class for easy management

Here we place our text to be transalted. We need to remeber that _e function is the one that is translating text. For references you can see https://codex.wordpress.org/Function_Reference/_e what it does. Notice that in the end we put ‘twentyfourteen’ – name of active theme. Please remember the line number on which we _e function resides because we’ll need it..

Translating text - Php file that needs to be edited
Translating text – Php file that needs to be edited

After we wrote our lines we close the css class and php. We used a line ( hr ) as separation method

Centering in CSS

That’s all for our index.php file. We need to edit our class in css file. On most wordpress themes the main style sheet file is named style.css. We found ours in /public_html/wp-content/themes/twentyfourteen/style.css

Text centering (left,right and top)

We used a list and instead of classic bullets we used our website icon.

Translating text for one of our active languages

We open with notepad++ from languages ro_RO.po file ( /public_html/wp-content/themes/twentyfourteen/languages/ro_RO.po )

We’re looking for #: index.php , if it doesn’t exist we can add it.
The line #: index.php:20 means that we’ll translate from index.php file line 20. msgid is exactly what we write in index.php (English) and msgstr is translated text (Romanian). Example:

Please pay attention at ‘ and “. For apostrophe we escaped the char with

To have a different text in romanian we can add sentences after translation. For example:

After all translation we can open the file ro_RO.po with poedit. From file we choose compile to mo. We’ll upload both files po and mo to /public_html/wp-content/themes/twentyfourteen/languages/

If you need translating text in other language please repeat the above step for every language.
Good luck :)


All code lines that we used in translating text from front page, in all files:
Last modified: December 8, 2015