The file that you need to download is style.css which can be found in httpdocs/wp-content/themes/{the name of you theme}/style.css. Once downloaded, you can open it with a word processor of your choice and choose find “hyphens” to find every instance of the word “hyphens” in the file. Do not enter the quotation marks in your search. If the properties of hyphens is “manual” or “none”, then this does not need changing. Only change the sections that show the properties as “auto” (ie: “hyphens: auto;”). For example, the following was one section of code that needed changing in my theme:

.widget {    color: #707070;    color: rgba(51, 51, 51, 0.7);    -webkit-hyphens: auto;    -moz-hyphens: auto;    -ms-hyphens: auto;    hyphens: auto;    margin: 0 auto 9.09090%;    width: 100%;    word-wrap: break-word;}

I would then change it to the coding as follows:

Rather than edit every post or page that you create, you can change the style.css file in WordPress from an auto hyphenation to none. Upon logging into WordPress, select Appearance in the menu on your left and then select Editor. In the upper right side, select the theme that you wish to edit from the dropdown list and then click on Select. On the right side is a list of template files and stylesheet files. The file that you will edit is called style.css.

Before we change this files, we need to know where to change it. This editor in WordPress does not have an search feature. Therefore, you need to download a copy of it using FTP. If you do not have an FTP client app, then I recommend that you download Filezilla, which is a free FTP app. There is plenty of training in Wealthy Affilliate on using FTP. Just enter FTP in the search field and you will find all kinds of FTP training.

.widget {    color: #707070;    color: rgba(51, 51, 51, 0.7);    -webkit-hyphens: manual;    -moz-hyphens: manual;    -ms-hyphens: manual;    hyphens: manual;    margin: 0 auto 9.09090%;    width: 100%;    word-wrap: normal;}

Notice that I also change the word-wrap from break-word to normal. Now do this to every section in the file that has hyphens properties as “auto”. Although you do not need to know this, the explanation as to why there are several hyphens coding lines is that “-webkit-” is used for the Safari browser, “-moz-” is used for the Firefox browser, “-ms-” is used for the Internet Explorer browser, and just plain “hyphens” is used for all other browsers.

Once these changes are made, you will not have to edit each page or post. The words will not be hypenated on your website. However, there is one problem with this. Whenever there is an update of your theme, your changes will be overwritten with the original coding and you will have to do these steps again to set it back the way that you want it. This brings us to the third method.



Join the Discussion
Write something…
Recent messages
marcelg Premium
Thanks for the instructions on how to overcome that particular problems. I haven't come across it yet, but at least I know WA will be my first search if it ever comes up and I will likely find this training again.
Reply
robmer Premium
You are fortunate to not have this problem. My content looked terrible with all the hyphinations. Whereas I could not find any solutions in WA, I researched the solution and then decided to share it with WA with a training post. There is no sense to have my fellow WA members to suffer from this problem also.
Reply
Top