dfguide.html 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  6. <title>公众号欢迎语设置</title>
  7. <script src="/assets/libs/jquery/dist/jquery.min.js"></script>
  8. <script src="/assets/libs/clipboard/dist/clipboard.min.js"></script>
  9. <style type="text/css">
  10. .user_rt * {
  11. padding: 0;
  12. margin: 0;
  13. box-sizing: content-box;
  14. }
  15. input, textarea, button {
  16. margin: 0;
  17. padding: 0;
  18. border: none;
  19. outline: none;
  20. }
  21. .content {
  22. overflow: auto;
  23. }
  24. .user_rt {
  25. overflow: hidden;
  26. background-color: #fff;
  27. margin: 0;
  28. padding: 0 0 100px 0;
  29. }
  30. .user_rt .cur_title {
  31. height: 59px;
  32. line-height: 59px;
  33. border-bottom: 1px solid #f0f0f0;
  34. font-size: 20px;
  35. color: #333;
  36. padding-left: 20px;
  37. position: relative;
  38. font-weight: normal;
  39. }
  40. .user_rt .cur_title.h100 {
  41. height: 100px;
  42. }
  43. .user_rt .cur_title a.user_data {
  44. float: left;
  45. margin-top: 31px;
  46. font-size: 16px;
  47. color: #666 !important;
  48. height: 38px;
  49. display: inline-block;
  50. text-align: center;
  51. background: #fff;
  52. line-height: 38px;
  53. margin-right: 10px;
  54. border: 1px solid #ececec;
  55. padding: 0px 22px;
  56. border-radius: 4px;
  57. }
  58. .user_rt .cur_title a.user_data_current {
  59. color: #fff !important;
  60. background-color: #327ccb;
  61. }
  62. .contxt {
  63. padding: 28px 0 0 28px;
  64. }
  65. .contxt h2 {
  66. color: #333;
  67. font-size: 16px;
  68. font-weight: normal;
  69. height: 36px;
  70. line-height: 36px;
  71. margin-bottom: 15px;
  72. }
  73. .contxt h3 {
  74. margin-top: 38px;
  75. color: #333;
  76. font-size: 14px;
  77. font-weight: normal;
  78. }
  79. .contxt p {
  80. line-height: 38px;
  81. font-size: 14px;
  82. color: #999;
  83. }
  84. .user_rt .form2list {
  85. padding-left: 0;
  86. padding-top: 33px;
  87. }
  88. .user_rt .form2list .tablebox {
  89. padding: 5px 0 5px 28px;
  90. position: relative;
  91. width: 100%;
  92. }
  93. a {
  94. text-decoration: none;
  95. cursor: pointer;
  96. color: #666;
  97. }
  98. table {
  99. border-spacing: 0;
  100. border-collapse: collapse;
  101. width: 100%;
  102. }
  103. .user_rt tr {
  104. width: 100%;
  105. padding: 15px 0;
  106. line-height: 40px;
  107. color: #666;
  108. }
  109. .user_rt th.w75 {
  110. width: 75px;
  111. }
  112. .user_rt th {
  113. width: 112px;
  114. }
  115. .user_rt textarea.text {
  116. width: 100%;
  117. max-width: 418px;
  118. height: 200px;
  119. word-break: break-all;
  120. font-size: 13px;
  121. line-height: 30px;
  122. resize: none;
  123. overflow: auto;
  124. box-sizing: content-box;
  125. }
  126. .user_rt .text {
  127. padding: 10px 15px;
  128. width: 250px;
  129. height: 18px;
  130. line-height: 18px;
  131. font-size: 14px;
  132. border: 1px solid #dadada;
  133. }
  134. .user_rt .submit.h50 {
  135. height: 50px;
  136. line-height: 50px;
  137. }
  138. .user_rt .submit {
  139. display: inline-block;
  140. *display: inline;
  141. *zoom:1;
  142. padding: 0px 32px;
  143. height: 46px;
  144. line-height: 46px;
  145. background-color: #327ccb;
  146. color: #fff;
  147. font-size: 14px;
  148. border-radius: 2px;
  149. border: none;
  150. overflow: hidden;
  151. cursor: pointer;
  152. }
  153. .gzh_cont {
  154. padding-left: 110px;
  155. margin-top: 30px;
  156. }
  157. .gzh_cont h1 {
  158. font-weight: normal;
  159. font-size: 14px;
  160. color: #333;
  161. }
  162. .gzh_cont p {
  163. font-size: 12px;
  164. color: #999;
  165. line-height: 30px;
  166. }
  167. .form2list{
  168. float: left;
  169. padding-right: 100px;
  170. max-width: 550px;
  171. }
  172. .gzh_img_but{
  173. float: left;
  174. margin:50px 0 0 103px;
  175. width: 260px;
  176. overflow: hidden;
  177. }
  178. .gzh_img_but img{
  179. display: block;
  180. width: 100%;
  181. border: 0;
  182. }
  183. </style>
  184. </head>
  185. <body>
  186. <div class="user_rt">
  187. <h1 class="cur_title">公众号欢迎语设置</h1>
  188. <div class="form2list form3list">
  189. <div class="tablebox">
  190. <table border="0" cellpadding="0" cellspacing="0">
  191. <tbody>
  192. <tr>
  193. <th class="w75" valign="top" scope="row">链接:</th>
  194. <td>
  195. <textarea id="many_copy_dom" class="text" row="6">欢迎关注&#10;&#10;<a href="{$sub_url}">点此继续阅读>></a>&#10;&#10;为方便下次阅读,请置顶公众号</textarea>
  196. </td>
  197. </tr>
  198. <tr>
  199. <th class="w75">&nbsp;</th>
  200. <td>
  201. <a href="javascript:;" class="submit h50 many_copy">复制链接</a>
  202. </td>
  203. </tr>
  204. </tbody>
  205. </table>
  206. </div>
  207. <div class="gzh_cont">
  208. <h1>欢迎语设置教程</h1>
  209. <p>1、将框内代码复制放到公众号的“被添加自动回复”中,会生成一个继续阅读链接。可以让关注后的用户方便地继续阅读之前的章节</p>
  210. </div>
  211. </div>
  212. <a href="/assets/img/gzh.png" class="gzh_img_but" target="_blank"><img class="gzh" src="/assets/img/gzh.png" width="260"></a>
  213. </div>
  214. <script>
  215. var clipboard = new Clipboard('.many_copy', {
  216. target: function (trigger) {
  217. trigger = document.querySelector('#many_copy_dom');
  218. Toastr.success('复制成功');
  219. return trigger;
  220. }
  221. });
  222. clipboard.on('error', function (data) {
  223. Toastr.error('复制失败');
  224. })
  225. </script>
  226. </body>
  227. </html>