自定义一个WordPress外贸网站首页

自定义一个WordPress外贸网站首页

作者:DIYzhan.com |  浏览:13375 |  评论已关闭 条评论
Ad - Web Hosting from SiteGround - Crafted for easy site management. Click to learn more.

我们安装WordPress网站后,一般WordPress的网站首页布局都是左边是最新的10篇文章,右边或左边是一个侧边栏,顶部是导航菜单,有点千遍一律的感觉,对于外贸网站来说,这样的布局有点不合适,为改变这种状况,我们可以自定义WordPress首页。

build_homepage_01

为改变这种网站布局,我们可以选择安装主题,而该主题带有一个自己的首页或者支持自定义的网站静态首页。这时,我们可以启用该主题的首页(home page)作为首页;或者我们新建一个页面并通过外观(Appearance)->自定义(Customize)->静态首页来选定该页面为首页(或者在后台Settings->Reading->Front page displays->A static page->Front Page选择创建的那个静态页面home page)。以下讲新建一个页面并设定它为主页的自定义WordPress首页步骤:

  1. 安装插件:Page Builder by SiteOrigin 和  Meta Slider ;build_homepage_02
  2. 用Meta Slider建首页幻灯片:根据你网站页面的宽度,在Meta Slider的设置框中设置一个(滑块)Slider的尺寸,效果等,本例命名该Slider为Featured Product;然后按尺寸制作3幅图片,将该3幅图片“添加幻灯片”到该Slider里;这样就建好了一个滑块(Slider)。build_homepage_08build_homepage_09
  3. 新建一个页面(Page),并选择页面模板(Template)为:全宽度页面模板,无边栏(Full Width Page);编写模式选择为Page Builder(这是安装了Page Builder插件后有的选项);build_homepage_03
  4. 在页面编辑的左上角有个Add Row按钮,可以给页面添加rows(行),添加3个rows(行),每行分别为 1 column(列), 1 column(列), 3 columns(列);build_homepage_04build_homepage_05
  5. 添完行后,点击选中其中1个row,再点击左上角上的Add Widget(小工具),分别给每个框内添加Text,  Meta Slider, Text,Text, Text 或者其他小工具,每次添加1个小工具,都会弹出编辑这个小工具内容的对话框,编辑它的内容;在添加Meta Slider时弹出的编辑框选择前面建好的滑块(Slider)名:Featured Product;build_homepage_06build_homepage_07build_homepage_10
  6. 往框内添完小工具并编辑内容后,记得要保存页面;
  7. 做好首页页面后,要通过外观(Appearance)->自定义(Customize)->静态首页首页显示选择一个静态页面,选择上面建立的页面即可预览,最后保存并发布;另外在外观(Appearance)->菜单(Menu)创建一个顶部导航菜单时,添加个自定义链接(Links)到菜单(点击该自定义链接Custom后面那个箭头打开编辑这个Link的Title为Home,链接URL是到网站域名),并指定菜单位置为Primary Menu(顶部导航),保存。注意:另外在后台Settings->Reading->Front page displays->A static page->Front Page选择创建的那个静态页面home page也可以自定首页;build_homepage_12add_top_menu_2

若该主题支持更多的小工具,那么还可以在添加的行中添加其他小工具,实现多种效果。如见《使用WordPress搭建一个简单的外贸网站全过程》中使用的主题Vantage,它自身带了些小工具,可以添加到首页,实现更多的效果。大家有什么好的小工具也可以推荐给我哦。

另外Page Builder还可以制作其他的个性页面,如About Us,Contact Us等页面也可以使用Page Builder来制作个性的页面,做法是和做首页页面一样的。

原创文章,转载请注明: 转载自DIYzhan.com-从零开始自己做外贸网站和海外网络营销
本文链接地址:https://www.diyzhan.com/2014/03/make_homepage_for_wordpress/

相关推荐
更多

评论已关闭。

长按扫我微信
需要帮助?
点击这里给我发消息