[wordpress插件] DMD Infinite ScrollDMD无限滚动

Plugin provide AJAX loading for WooCommerce products and can be used for any other posts.

插件为WooCommerce产品提供AJAX加载，并可用于任何其他帖子。

Paginate up to 10 sets of posts in the same template.

在同一模板中最多可分10组帖子。

Can be compatible with any other AJAX plugins, that has option to call custom JavaScript code.

可以与任何其他可以调用自定义JavaScript代码的AJAX插件兼容。

• Infinite Scroll – Automatically load new products(posts) when the user scroll down and reaches the bottom of the products(posts).
• 无限滚动–当用户向下滚动并到达产品（帖子）的底部时，自动加载新产品（帖子）。

• Load More Button – Click to load new products(posts).
• 加载更多按钮–单击以加载新产品（帖子）。

• Pagination – Normal pagination but load the next page with AJAX.
• 分页–常规分页，但使用AJAX加载下一页。

Use one plugin for different pages and post types.

将一个插件用于不同的页面和帖子类型。

Work great with WordPress and WooCommerce

与WordPress和WooCommerce完美协作

Features

功能

• Infinite scroll, load more buttons or AJAX pagination for posts and products.
• 无限滚动，为帖子和产品加载更多按钮或AJAX分页。

• Multiple sets of settings.
• 多组设置。

• Infinite scroll and load more button for next page and previous page.
• 无限滚动并加载下一页和上一页的更多按钮。

• Only the required number of pages is displayed at the same time.
• 仅同时显示所需的页面数。

• Page can be scrolled to the top, when products is replaced.
• 更换产品后，页面可以滚动到顶部。

• Custom threshold for infinite scroll
• 无限滚动的自定义阈值

• Custom load image can be loaded.
• 可以加载自定义加载图像。

• Easy stylization for next page button and previous page button.
• 轻松样式化下一页按钮和上一页按钮。

• Custom JavaScript code can be execute before or after posts(products) load
• 自定义JavaScript代码可以在帖子（产品）加载之前或之后执行

• HTML5 PushState
• HTML5 PushState

Setup

设置

• Once the plugin is installed navigate in admin area to “DMD Infinite Scroll”( “DMD Plugins” -> “DMD Infinite Scroll” ).
• 安装该插件后，请在管理区域中导航至“ DMD Infinite Scroll”（“ DMD Plugins”->“ DMD Infinite Scroll”）。

• Select theme from drop down list “Presets”.

• 从下拉列表“预设”中选择主题。

  If your theme isn’t listed then add the correct selectors.

如果您的主题未列出，请添加正确的选择器。

• You can use special tool to setup selectors(work only for “Setting set 1”)
• 您可以使用特殊工具来设置选择器（仅适用于“设置集1”）

1. Your site with posts(products) must contain at least 3(three) pages.
2. 您的带有帖子（产品）的网站必须至少包含3（三）页。

3. Open second page.
4. 打开第二页。

5. Add to the page link “?dmd_is=selectors” or “&dmd_is=selectors” if link already has “?”

6. 将链接“？dmd_is = selectors”或“＆dmd_is = selectors”添加到页面（如果链接已包含“？”）

   symbol.

符号。

7. Click on element and move to the previous element with “Parent” button on right and bottom.
8. 单击元素，然后使用右侧和底部的“父级”按钮移至上一个元素。

9. Red border show element, that selected.
10. 选中的红色边框显示元素。

11. Click next if this is correct element.
12. 如果这是正确的元素，请单击“下一步”。

• This is experimental tool.

• 这是实验工具。

  It may not work with some themes.

  它可能不适用于某些主题。

  It is also sometimes necessary to edit the result of yourself.

有时还需要编辑自己的结果。

• If this tool isn’t work for you, then use your browser developer tools.
• 如果该工具不适合您，请使用浏览器开发人员工具。

• “Posts Selector” The selector that wraps all of the posts/products.
• “帖子选择器”，用于包装所有帖子/产品的选择器。

• “Post Selector” The selector of an individual post/product.
• “帖子选择器”是单个帖子/产品的选择器。

• “Pagination Selector” The selector of the post/product pagination.
• “分页选择器”（post / product pagination）的选择器。

• “Next Selector” The selector of the pagination next link.
• “下一个选择器”：分页下一个链接的选择器。

• “Previous Selector” The selector of the pagination next link.
• “上一个选择器”是分页下一个链接的选择器。

• “Pages Selector” The selector of the other pagination links.
• “页面选择器”是其他分页链接的选择器。

• Choose settings, that you want.
• 选择所需的设置。

• Click “Save Changes”.
• 点击“保存更改”。

Multiple sets of settings

多组设置

• Select in “Sets count” option how many sets you need.
• 在“套数”选项中选择所需的套数。

• Click “Save and reload” button.
• 点击“保存并重新加载”按钮。

• You can navigate between settings sets with help of “Current set” drop down list.
• 您可以借助“当前设置”下拉列表在设置集之间导航。

Styling

样式

• You can style buttons in admin area.
• 您可以在管理区域中设置按钮样式。

• Navigate to “DMD Infinite Scroll”( “DMD Plugins” -> “DMD Infinite Scroll” )
• 导航到“ DMD无限滚动”（“ DMD插件”->“ DMD无限滚动”）

• Open “Styles” tab.
• 打开“样式”标签。

• Click on “Edit styles” button.
• 单击“编辑样式”按钮。

• Click option(Margin, Border, Padding, Content) to edit it.

  单击选项（边距，边框，填充，内容）进行编辑。

• Also you can style any button with help of CSS code.

  您还可以在CSS代码的帮助下为任何按钮设置样式。

1. “div.dmd_next_page” – wraper for next page button.

2. “ div.dmd_next_page” –下一页按钮的包装。

   “div.dmd_next_page a.button” – next page button.

“ div.dmd_next_page a.button” –下一页按钮。

3. “div.dmd_previous_page” – wraper for previous page button.

4. “ div.dmd_previous_page” –前一页按钮的包装。

   “div.dmd_previous_page a.button” – previous page button.

“ div.dmd_previous_page a.button” –前一页按钮。

5. “div.dmd_ajax_product_load” – wraper for loading image.

6. “ div.dmd_ajax_product_load” –用于加载图像的包装器。

   “div.dmd_ajax_product_load img” – loading image.

“ div.dmd_ajax_product_load img” –加载图像。