部分的に、翻訳文字列を変更するくらいはCSSでも可能です
WordPressは、ベースが英文で翻訳ファイルを使って日本語表示を行いますが、日本語の翻訳ファイルが無く、リンクなどが英文で表示されることがあります。
翻訳用の関数が適切に使用されている場合は、チャイルドテーマ等で、独自の翻訳ファイルを作成してカスタマイズする事ができますが、PHPのスキルを必要とします。
条件が合えば、CSSでリンク文字列を変更するような事はCSSでも可能で、その方法を知っておくと便利です。
以下、:before、:after擬似要素を使ってリンク文字列をCSSで置換してみたいと思います。
HTML
<a href="http://example.com/archives/27941#more-27941" class="replace-link">Keep reading →</a>(このリンクを置換します) <a href="http://example.com/archives/27941#more-27941">Keep reading →</a>(元のままのリンクです)
CSS
.replace-link{ overflow:hidden; color:rgba(0,0,0,0); /* rgbaを使って文字を透明にします */ width:2em;/* 変更後の文字列の長さに合わせます */ height:1em; line-height:1; display:inline-block; } .replace-link:before{ content:'詳細'; color:rgba(0,0,0,1); }
以下のコードでも、多くのブラウザで動作しますが、edgeを除くie11以下では、文字列が表示されません。
.replace-link{ visibility:hidden; margin-right:-107px;/* 元表示されていた文字列幅分のネガティブマージンを与えます */ } .replace-link:before{ content:'詳細'; visibility:visible; }
https://connect.microsoft.com/IE/feedback/details/1449224/ie-11-the-descendants-of-an-invisible-visibility-hidden-element-should-be-visible-if-they-had-visibility-visible
Example
Keep reading →(このリンクを置換します)
Keep reading →(元のままのリンクです)