WordPress使用Elementor插件免代码实现返回顶部按钮，支持向下滑动渐入（可能需要pro版本）以及平滑滚动至顶部，无需代码操作；
json文件内容：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 |
{ "content": [{ "id": "73f66411", "settings": { "_title": "back to top" }, "elements": [{ "id": "2e0699a2", "settings": { "_column_size": 0, "_inline_size": null, "margin": { "unit": "px", "top": "0", "right": "0", "bottom": "0", "left": "0", "isLinked": true }, "padding": { "unit": "px", "top": "0", "right": "0", "bottom": "0", "left": "0", "isLinked": true } }, "elements": [{ "id": "5e6d6650", "settings": { "selected_icon": { "value": "fas fa-arrow-alt-circle-up", "library": "fa-solid" }, "view": "stacked", "link": { "url": "#top", "is_external": "", "nofollow": "", "custom_attributes": "" }, "primary_color": "#FDFDFD", "secondary_color": "#7C9ABA", "size": { "unit": "px", "size": 35, "sizes": [] }, "icon_padding": { "unit": "px", "size": 2, "sizes": [] }, "_element_width": "auto", "_element_width_tablet": "auto", "_element_width_mobile": "auto", "_element_custom_width": { "unit": "px", "size": 62, "sizes": [] }, "_position": "fixed", "_offset_orientation_h": "end", "_offset_x_end": { "unit": "vw", "size": 1, "sizes": [] }, "_offset_x_end_tablet": { "unit": "vw", "size": 1, "sizes": [] }, "_offset_x_end_mobile": { "unit": "vw", "size": 2, "sizes": [] }, "_offset_orientation_v": "end", "_offset_y": { "unit": "vw", "size": 19, "sizes": [] }, "_offset_y_tablet": { "unit": "vh", "size": "", "sizes": [] }, "_offset_y_mobile": { "unit": "vh", "size": "", "sizes": [] }, "_offset_y_end": { "unit": "vh", "size": 1, "sizes": [] }, "_offset_y_end_tablet": { "unit": "vh", "size": "", "sizes": [] }, "_offset_y_end_mobile": { "unit": "vh", "size": 1, "sizes": [] }, "_z_index": 99, "motion_fx_motion_fx_scrolling": "yes", "motion_fx_translateY_direction": "negative", "motion_fx_opacity_effect": "yes", "motion_fx_opacity_range": { "unit": "%", "size": "", "sizes": { "start": 12, "end": 28 } }, "motion_fx_range": "viewport", "__globals__": { "primary_color": "", "secondary_color": "" } }, "elements": [], "isInner": false, "widgetType": "icon", "elType": "widget" }], "isInner": false, "elType": "column" }], "isInner": false, "elType": "section" }], "page_settings": [], "version": "0.4", "title": "\u8fd4\u56de\u9876\u90e8(\u9700\u8981\u5728\u9876\u90e8\u5bb9\u5668\u52a0\u4e00\u4e2aID_top)", "type": "section" } |
使用方法：
- 将以上代码保存为json文件，Elementor后台导入模块；
- 在任意通用区块(通常为Footer)插入模块，根据需求设置图标样式；
- 设置一个顶部区块id为top。