食品法典委员会

对函数、挂钩、类或方法感兴趣吗?查看新的WordPress代码参考

从右向左的语言支持

添加对用编写的语言的支持从右到左(RTL)方向很容易。

有两种方法:

  • 通过创建名为样式-rtl.css
  • 通过在名为rtl.css公司

方法1:style-rtl.css

  • 使用自动RTL css创建者,例如RTLCSS公司CSS肛门创建rtl版本的样式表文件。将结果另存为样式-rtl.css并放置在同一位置。
  • 使用wp_排队_样式将style.css文件排入主题中。如果文件只是嵌入到头文件中,这将不起作用
  • 使用wp样式添加数据设置实时通讯属性到代替用于样式表。

例子:

wp_enqueue_style('themeslug-style',get_stylesheet_uri());wp_style_add_data('themeslug-style','rtl','replace');

笔记

  • 上述两个工具都具有开发人员友好的工具,可以自动创建RTL样式表。

方法2:rtl.css

  • 从主主题样式表开始(通常样式表)。
  • 将此文件另存为rtl.css公司
  • 将以下属性添加到车身选择器:
方向:rtl;unicode-bidi:嵌入;
  • 逐个检查CSS选择器并执行以下操作:删除所有不相关的属性,如字体样式属性、颜色、垂直位置、宽度和高度等。更改以下属性的值(从右向左和vice-versa):
    • 文本方向
    • 浮动
    • 清楚的
文本对齐:左;浮动:右;清除:左侧;

成为

文本对齐:右;浮动:左;清晰:右侧;
  • 添加相关图像的RTL版本。

有些图像显然只适用于一个方向(例如箭头)。创建这些图像的水平翻转版本。

  • 镜像以下属性,并将原始属性归零
    • 边缘
    • 衬垫
    • 边界
    • 背景位置
    • 右/左定位
.评论链接{背景:url(“./images/comments.gif”)无重复0 3px;左侧填充:15px;边距:2px 4px 0px 12px;左:10px;}

成为

.注释链接{背景:url(“./images/comments-rtl.gif”)无重复100%3px;padding-left:0;向右填充:15px;边距:2px 12px 0px 4px;左:自动;右:10px;}

对于使用text-indent隐藏文本的按钮,需要将其值从负值更改为正值:

.图像按钮{文本提示:-99999像素;}

成为

.图像按钮{文本提示:99999像素;}

工具

RTL测试仪插件允许您轻松切换站点的文本方向:http://wordpress.org/extend/plugins/rtl-tester/

附言:这个插件只允许查看RTL。例如,当文本方向改变时,你的网站会是什么样子?观众不会看到这个改变(除非整个CSS都改变了)。

特殊情况

  • 您需要手动调整像素定位背景。如果原始值为“0”,则可以将其更改为100%
  • 定位:记住将“自动”值指定给原始选择器
  • 在LTR和RTL语言中,某些字段应该是从左到右的方向,例如:电子邮件、电话、邮政编码、代码、URL,并且任何输入都包含英文字母和数字。因此,最好为每个输入字段分配一个唯一的id或类,这样就可以在CSS文件中使其成为LTR方向

例子:

<input type=“text”class=“email address1 email”id=“email address1”/><input type=“text”class=“tel-number1 tel”id=“tel-nomber1”/><input type=“text”class=“zip1-zip”id=“zip1”/><input type=“text”class=“url-address1 url”id=“url-address1”/>

使用类:

/*这些字段应为RTL语言方向的LTR*/.电子邮件地址1,.电子邮件,.电话号码1,.电话,.zip1,.url地址1,.url,...{方向:ltr;}

用RTL语言写帖子

WordPress默认的可视文本编辑器不支持使用RTL语言(如希伯来语、波斯语和阿拉伯语)编写。因此,如果你愿意用其中一种语言写文章,你应该:

  • 重新安装/更改你的WordPress版本为该语言,这修复了这个问题,允许你默认使用RTL编写。
  • 使用此插件:http://wordpress.org/plugins/wp-rtl/它在TinyMCE编辑器中添加了两个按钮(如果您有),以启用从左到右(LTR)和从右到左(RTL)的文本方向更改。