簡體   English   中英

如何將內聯 CSS 添加到 Wordpress Visual Composer 中?

[英]How do I add inline CSS into the Wordpress Visual Composer?

我可能問錯了問題(我不是編碼員),但我試圖將 HTML 和內聯樣式表粘貼到 Wordpress Visual Composer 的文本端(HTML 端)以創建 email 布局,並且最終產品是在未設置樣式的 HTML 布局上方寫出的整個樣式表,因此我假設此作曲家不支持內聯樣式表。

Visual Composer 中的 HTML 視圖 Visual Composer 中的視覺視圖 損壞的電子郵件

為了清楚起見,我使用了一些背景故事,我正在使用插件“電子郵件后下載”,它只提供標准的 Wordpress 視覺作曲家,以便創建用戶在“注冊”后收到的 email。 這似乎限制了我要么像使用 Microsoft Word 那樣使一些文本更加生動(這對於以品牌為中心的業務來說是不夠的),要么使用原始的獨立 HTML,這對於格式正確的模板來說是不夠的.

是否有任何插件可以幫助在此處添加 CSS 樣式,一旦它顯示在網站外部(即在 email 瀏覽器中)就會起作用?

從圖像來看,你有一個普通的編輯器而不是 Visual Composer,這很好,因為這是唯一正確的方向,你不能使用構造函數(Visual Composer)創建 email 模板,因為創建 email 模板需要特殊的老派知識(表。內聯樣式)和干凈的標記。 我建議您使用現成的模板並將其更改為您自己的模板。

示例: https://colorlib.com/etc/email-template/3/index.html

你需要知道什么

  1. 您需要使用 html 表
  2. 您需要使用內聯 css
  3. 使用完整的 src 顯示圖像 ( https://yoursite.wp/.../demo.jpg ) 您可以從媒體帖子中獲得的鏈接

不建議:

  1. 如果您對 Gmail 感興趣,請在 header 中使用 css styles 應用支持: https://templates.mailchimp.com/resources/email-client-css-support/
  2. 定制fonts
  3. Visual Composer 和任何其他構造函數

添加:

如果您可以使用短代碼系統,我建議為您創建一個迷你插件:

  • plugins/my-custom-emails [新插件的根目錄]

  • plugins/my-custom-emails/my-custom-emails.php [插件的主要 php 文件]

  • plugins/my-custom-emails/emails/ [所有模板的目錄]

  • plugins/my-custom-emails/emails/template1.html [第一個演示模板]

我的自定義電子郵件.php

<?php
/*
Plugin Name: My emails
Description: My custom emails
Version: 0.1.0
*/

define('MYCELS_DIR', plugin_dir_path(__FILE__));

add_shortcode( 'myemails', 'MYCELS_SHORTCODE' );
function MYCELS_SHORTCODE($attrs) {
    if(empty($attrs['id'])) {
        return 'ID required';
    }
    $ID = $attrs['id'];
    $PATH = MYCELS_DIR . 'emails/'.$ID.'.html';
    if(file_exists($PATH)) {
        return file_get_contents($PATH);
    } else {
        return 'File with '. $ID . ' ID not exists';
    }
}

模板1.html

<div>
    Template
</div>

並使用:

[myemails id=template1]

id = 模板名稱

如果你想要一些非常可定制的東西,這個插件可以工作, https://en-gb.wordpress.org/plugins/wp-html-mail/非常好,會推薦! 有了它,您可以完全控制 CSS,而 HTML 也帶有模板,並且可以根據您的需要進行更多控制!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM