請問電子報訂閱機制應如何放在平台上?
目前想到有兩個方式：
1.放入聯盟使用的電子報平台原始碼
2.放表單連結，人工定期匯入使用中的電子報平台
上述1.的原始碼如下：
訂閱自律聯盟好事報
您可以從電子郵件中得到自律聯盟最新的消息與資訊
立即訂閱
訂閱服務確認
已發送 Email 驗證信給你，請點擊信件連結以完成訂閱程序
#sub-form-container button { border: none; margin: 0; padding: 0; width: auto; overflow: visible; background: transparent; color: inherit; font: inherit; text-align: inherit; line-height: normal; appearance: none; -webkit-appearance: none; outline: none; cursor: pointer; transition: color 0.25s, background-color 0.25s; } #sub-form-container button:focus { outline: none; } #sub-form-container input, #sub-form-container label, #sub-form-container textarea { margin: 0; border: 0; padding: 0; display: inline-block; vertical-align: middle; white-space: normal; background: none; line-height: 1; outline: 0; font: inherit; } ::-webkit-input-placeholder { color: #ccc; } ::-moz-placeholder { color: #ccc; } :-ms-input-placeholder { color: #ccc; } :-moz-placeholder { color: #ccc; } #sub-form-container input:focus, #sub-form-container textarea:focus { outline: 0 !important; } #sub-form-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } #sub-form-container .content { position: absolute; top: -999999px; left: -999999px; opacity: 0; } #sub-form-container .content.active { position: initial; top: 0; left: 0; opacity: 1; } #sub-form-content { box-sizing: border-box; color: #555555; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: #f5f5f5; padding: 40px; border-radius: 10px; width: 100%; max-width: 490px; min-height: 310px; } #sub-form-content .content { padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } #sub-form input { padding: 0px 10px; border-radius: 2px; border: 1px solid #cccccc; background-color: #ffffff; } #sub-form input:focus { border-color: #3f7dbd; outline: none; } #sub-form .sub-inputs { box-sizing: border-box; margin-bottom: 10px; height: 42px; width: 100%; } #sub-form .btn { margin-top: 14px; } /* button color */ #sub-form-content .btn { box-sizing: border-box; border-color: #3f7dbd; background: #3f7dbd; color: #ffffff; border-radius: 4px; padding: 10px 32px; font-size: 16px; letter-spacing: 0.05em; cursor: pointer; } #sub-form-content .btn:disabled { opacity: 0.5; cursor: not-allowed; } #sub-form-content .btn.secondary { border-color: #666666; background-color: #666666; } #sub-form-content .content.confirm, #sub-form-content .content.err { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; width: 333px; } #sub-form-content .content .head { margin-bottom: 25px; text-align: center; } #sub-form-content .content .title { margin: 0; margin-bottom: 8px; font-size: 24px; letter-spacing: 0.03em; font-weight: bold; } #sub-form-content .content .description { margin: 0; font-size: 16px; line-height: 1.5; font-weight: normal; } @media (max-width: 480px) { #sub-form-container { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } #sub-form { border-radius: 0px; padding: 30px 16px; } #sub-form-content { padding: 32px 24px; } } @media (min-width: 500px) { #sub-form-content { width: 490px; } }
當然不要一直用手工轉換
工程師看過程式碼後
會試弄一下
連同那個課程也幫你設定