WordPress. 如何使用樱桃媒体视差插件(基于樱桃3.x)

我们的支持团队很高兴为您提供一个关于使用Cherry的新指南 Media Parallax plugin 在WordPress中展示了如何通过添加特定的控件来改变页面内容的外观 parallax features.

WordPress. 如何与樱桃MediaParallax插件工作

一旦你安装了你的 WordPress template，它看起来是一样的 background for the content. 如果您需要更改特定区域的设计，您可以使用 parallax features.

首先，您需要准备好要使用的站点 parallax plugin:

1. Download the plugin via the following link 并将文件保存到您的计算机:
2. Install this plugin 到你的WordPress网站 Plugins -> Add new -> Upload section:

   

3. Make sure the plugin is activated in Plugins -> Installed plugins section. 一旦激活，你就可以使用Cherry了 Parallax 网页上的短代码.

To use parallax plugin 效果，您应该打开任何网站页面，并包装所需的所需的内容 parallax shortcode.

1. 例如，你有 posts_grid shortcode on the page:

   [posts_grid columns="4" rows="2" order_by="date" order="DESC" thumb_width="150" thumb_height="150" meta="no"
    摘录="7" link="yes" link_text="more"]

   

2. In order to set background media，你可以把它改成

   [cherry_media_parallax typemedia="video" buffer_ratio="1" src_mp4 = " curtsurfing ..mp4 curtsurfing src_webm =.webm"
   src_ogv="curtsurfing.ogv curtsurfing src_poster =.jpg cherry_media_parallax_1“custom_class =)
   
   [posts_grid columns="4" rows="2" order_by="date" order="DESC" thumb_width="150" thumb_height="150" meta="no"
    摘录="7" link="yes" link_text="more"]
   
   [/ cherry_media_parallax]

   In this shortcode 可用的参数如下:

   •                 	typemedia="video"

     or

                     	typemedia="image"

     意味着视频/图像文件将显示为 background of the chosen area. 默认设置为video.

   •                 	buffer_ratio="1"

     参数Buffer_ratio接受一个带有浮点数的数值(float)，这个数字表示块的次数 parallax 是否大于外容器. 数字越大，越强 media 单位移动，效果越明显.

   • 	
                     	src_mp4 = " curtsurfing.mp4" 
                     	src_webm = " curtsurfing.webm" 
                     	src_ogv="curtsurfing.ogv"

     您需要设置3种视频文件格式:mp4、webm、ogv. 上传视频到你的 media 并将文件名设置为 shortcode.

   • 	
                     	src_poster = " curtsurfing.jpg"

     sc_poster image用于不支持的浏览器 tag . 海报是视频标签的可选属性，在显示的同时显示 browser 缓冲必要的视频部分. 同样的海报也会出现在ie8等过时的浏览器上 browser 无论出于何种原因，都不能显示您的视频.

   • 	
                     	custom_class = " cherry_media_parallax_1 "

     您可以设置自定义css类，以便将您的样式规则应用于内容的特定部分.

3. Another kind of parallax is

   [cherry_fixed_parallax src_poster = " content_bg1." offset_value="no" fixed_value="no"
   custom_class = " cherry_fixed_parallax1 ")
   
   [posts_grid columns="4" rows="2" order_by="date" order="DESC" thumb_width="150" thumb_height="150" meta="no"
    摘录="7" link="yes" link_text="more"]
   
   [/ cherry_fixed_parallax]

   This kind of parallax is based on css property background-attachment: fixed; but with a shift in background-position.

   In this shortcode 可用的参数如下:

   • 	
                     	src_poster = " content_bg1.jpg"

     将所需的图像上传到 media 库，并在这里设置文件名.

   • 	
                     	offset_value="no"

     偏移值yes/no设置a background 滚动页上的图像移位.

   • 	
                     	fixed_value="no"

     固定值yes/no用于使用 css property background-attachment: fixed; it can also be added invert_value (yes / no) to invert the offset if necessary.

   • 	
                     	custom_class = " cherry_media_parallax_1 "

     您可以设置自定义css类，将您的样式规则仅应用于内容的特定部分.

   它会让你看起来像这样:

   

感谢您阅读本教程. 请随时查看下面的视频说明:

WordPress. 如何与樱桃MediaParallax插件工作