提出讨论和解决问题更有助于帮助大家

这个页面的想法是来自于国外的论坛reddit,我特别喜欢这个,大家可以在共同的话题上进行各种讨论。 那么我们想做外贸独立站的朋友们肯定会遇到一些疑惑或者棘手的问题,我认为大家大胆的提出来,我们每个人都可以参与讨论和解决,这会把事情变的很有意义。

  • 你可以提交自己的问题或者话题
  • 搜索功能:使用浏览器的搜索功能就行:Ctrl+F 按键同时按
  • 你可以回复已经存在的话题或者发言,点击”回复“即可
  • 你提交回复时需要昵称和邮箱,这个邮箱不会公开
  • 每条信息都要经过站长的批准才能显示
  • 如果需要提交展示图片,例如问题截图,请点击这里
  • 站长非常感谢大家的积极参与,站长会积极回复每个朋友的问题

讨论区

170 回复

  1. icon list 上传svg无法改颜色的时候

    selector .elementor-icon-list-icon svg path {
        fill: inherit !important;
    }
  2. 外贸独立站最流行的谷歌字体

    “Montserrat”, “Poppins”, “Inter”, “Roboto”, “Open Sans”, “Oswald”,
    “Lato”, “Outfit”,”Source Sans Pro”, “Raleway”, “Jost”, “Noto Sans”, “Merriweather”,
    “Ubuntu”, “Playfair Display”, “Lora”, “Nunito”, “PT Sans”, “Rubik”, “Kanit”,
    “Work Sans”, “Quicksand”, “PT Serif”, “Noto Serif”, “Titillium Web”, “Heebo”,
    “Oxygen”, “Dosis”, “Bebas Neue”, “Karla”, “Josefin Sans”, “Libre Baskerville”,
    “Anton”, “Cairo”, “Bitter”, “Mukta”, “Abel”, “Hind”, “Pacifico”, “Prompt”,
    “Arvo”, “EB Garamond”, “Crimson Text”, “Exo 2”, “Barlow”, “Caveat”, “Dancing Script”,
    “Orbitron”, “Questrial”, “Catamaran”, “Maven Pro”, “Righteous”, “Rajdhani”,
    “Cormorant Garamond”, “Teko”, “Indie Flower”, “Signika”, “Cinzel”, “Archivo”,
    “Passion One”, “Domine”, “Inter”, “Yellowtail”, “Patua One”, “Cardo”, “Asap”,
    “Alfa Slab One”, “Volkhov”, “Philosopher”, “Zilla Slab”, “Merienda”, “Kalam”,
    “Russo One”, “Vidaloka”, “Alegreya”, “Lobster”, “Bree Serif”, “Crete Round”,
    “Saira”, “Spectral”, “Courgette”, “Noticia Text”, “Amatic SC”, “Sacramento”,
    “Architects Daughter”, “Shadows Into Light”, “Gloria Hallelujah”, “Abril Fatface”

  3. hover框架内部的css改变

    selector:hover .elementor-icon {
        color: #ffffff !important;
        fill: #ffffff !important; 
        border-color: #ffffff !important;  
    }
    
    
    selector:hover h3 {
        color: #f5f5f5 !important;
    }
    
    selector:hover p {
        color: #f5f5f5 !important;
    }
    
  4. /*跳转模块的时候#,预留顶部的距离*/
    :target {
      scroll-margin-top: 70px !important;
    }
    
  5. ele中 单独控制图标 svg的样式

    selector .elementor-icon {
    margin-top: 10px;
    }
  6. ele的filter 选项无法换行的解决

    .e-filter {
      flex-wrap: wrap !important; 
    }
    
  7. ele中的点Carousel 改变点的大小 颜色

    selector .swiper-pagination-bullet {
        border-radius: 0px;
    width: 10px;
    height: 10px;
    }
    
    selector .swiper-pagination-bullet-active {
        opacity: 1;
        background: #ff00ff !important;
        width: 90px !important;
    }
    
  8. 表单中美化方框选定

    
    /* 表单整体居中 */
    .elementor-form .elementor-field-group {
      text-align: center;
    }
    
    /* 选项容器:竖直排列,居中对齐 */
    .elementor-form .elementor-field-subgroup {
      
      text-align: left;
      margin: 6px 0;
    }
    
    /* 复选框:方形、边框加粗,没有圆角 */
    .elementor-form input[type="checkbox"] {
      width: 16px;
      height: 16px;
      margin-right: 5px;
      vertical-align: middle;
      appearance: none;         /* 去掉浏览器默认样式 */
      -webkit-appearance: none;
      border: 1px solid #000;   /* 黑色边框 */
      border-radius: 0;         /* 去掉圆角,保持方形 */
      background: #fff;
      cursor: pointer;
    }
    
    /* 选中状态:填充黑色或你想要的颜色 */
    .elementor-form input[type="checkbox"]:checked {   
        background-image: url(https://dulizhanchaoshi.com/wp-content/uploads/2025/06/check.svg);
        background-repeat: no-repeat;    
        background-color: #000000;
        background-size: 0.95rem;
    }
    
    /* 复选框对应文字 */
    .elementor-form .elementor-field-option {
    
      font-size: 14px;
      font-weight:500;
      vertical-align: middle;
      color:#222222;
    }
    
  9. D哥好~
    想请教一下,我想要在网站上面搞一个视频类目,里面分类好产品视频、公司视频、研发、测试视频、安装教程等。考虑到YouTube嵌入可能会有广告之类的,想直接在网站上面内嵌,这样是不是要升级一下服务器?我用的是某个服务器专业版的套餐。

    同时,我也问了一下gpt,它给我的建议是:更划算、稳定的做法是把视频托管给专业的视频/CDN 服务(Cloudflare Stream / Vimeo / YouTube),并把媒体从 WordPress 媒体库“外放”到云存储或 CDN(用 WP 插件),这样能保证播放流畅又不占用你现有主机资源。

    想听听你的意见

  10. ele的loop中单独展示几个热销的,按照这个做

    add_action('elementor/query/dddd_custom_query', function( $query ) {
        $post_ids = array(2024,1966); // 你的自定义产品 ID
        $query->set('post__in', $post_ids);
        $query->set('orderby', 'post__in'); // 保持顺序
    });
  11. 顶部的倒三角箭头

    .d2304-link-list:after {
    
    position: absolute;
    left: 50%;
    margin-left: -20px;
    top: -10px;
    width: 0;
    height: 0;
    content: '';
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #ffffff;
    
    }
  12. 想要设置WP后台登陆地址,还要到期的

    add_action('login_enqueue_scripts', 'custom_login_keyword_expiry_hours');
    function custom_login_keyword_expiry_hours() {
        // 设置中国东八区时区
        date_default_timezone_set('Asia/Shanghai');
    
        // 每个关键词 => [起始时间戳, 有效小时数]
        $login_keys = [
            'banana' => [strtotime('2025-06-07 10:00:00'), 35], // 有效35小时
            'apple'  => [strtotime('2025-06-07 08:00:00'), 12], // 有效12小时
            'mango'  => [strtotime('2025-06-07 09:30:00'), 6],  // 有效6小时
        ];
    
        $now = time(); // 当前时间戳(东八区)
    
        foreach ($login_keys as $key => [$start_time, $valid_hours]) {
            if (isset($_GET[$key])) {
                $expire_time = $start_time + ($valid_hours * 3600);
                if ($now < $expire_time) {
                    return; // ✅ 允许访问
                } else {
                    wp_die("登录链接 '$key' 已于 " . date('Y-m-d H:i:s', $expire_time) . " 过期。", '链接已过期', ['response' => 403]);
                }
            }
        }
    
        // ❌ 如果没有匹配参数或过期
        wp_redirect(home_url('/'));
        exit;
    }
    
    
  13. ele超级菜单居中

    .elementor-widget-n-menu .e-n-menu-content>.e-con {
         position: fixed !important;
      left: 50% !important;
      transform: translateX(-50%) !important;
    }
  14. 让文字限制几行的方式

    /* 通用样式:设置为多行省略号 */
    .d1011 {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      -webkit-line-clamp: 3; /* 默认桌面显示 3 行 */
    }
    
    /* 平板:最多显示 2 行 */
    @media (max-width: 1024px) {
      .d1011 {
        -webkit-line-clamp: 2;
      }
    }
    
    /* 手机:最多显示 1 行 */
    @media (max-width: 767px) {
      .d1011 {
        -webkit-line-clamp: 1;
      }
    }
    1. 另外一个方案2

      
      selector {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
      
        overflow: hidden;
        text-overflow: ellipsis;
      }
      
      
  15. 禁止右键复制的

    <script>
    document.addEventListener('contextmenu', function(e) {
      e.preventDefault();
    });
    </script>
    
  16. ele tab把click换成hover, hoverTabs为前缀

    <script>
    
    document.addEventListener('DOMContentLoaded',function(){
    jQuery(function($){
    $('.hoverTabs .e-n-tab-title').mouseenter(function(){
    $(this).click();
    });
    });
    });
    </script>
    
  17. 上滑下滑停留 隐藏显示,上滑就显示菜单

    /* 确保 Sticky Header 过渡效果 */
    /* 确保 Sticky Header 过渡效果 */
    .dd1130-sticky-header {
        transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    }
    
    /* 当下滑时隐藏 */
    .dd1130-sticky-header.dd1130-hidden {
        opacity: 0;
        transform: translateY(-100%);
        pointer-events: none; /* 避免影响交互 */
    }
    
    
    1. document.addEventListener("DOMContentLoaded", function () {
          let lastScrollY = window.scrollY;
          let header = document.querySelector(".dd1130-sticky-header");
      
          if (!header) return; // 确保 header 存在
      
          window.addEventListener("scroll", function () {
              if (window.scrollY > lastScrollY) {
                  // 下滑隐藏
                  header.classList.add("dd1130-hidden");
              } else {
                  // 上滑显示
                  header.classList.remove("dd1130-hidden");
              }
              lastScrollY = window.scrollY;
          });
      });
      
      
  18. ele 隐藏页面的默认标题

    function ele_disable_page_title( $return ) {
    return false;
    }
    add_filter( 'hello_elementor_page_title', 'ele_disable_page_title' );
    
  19. 丝滑滚动的ele

    selector .swiper-wrapper {
    -webkit-transition-timing-function: linear!important;
    transition-timing-function:linear!important;
    }
  20. Project显示层级

    function show_hierarchical_project_categories( $args, $post_id ) {
        if ( 'project' === get_post_type( $post_id ) ) {
            $args['checked_ontop'] = false; // 禁止选中的分类固定在顶部
        }
        return $args;
    }
    add_filter( 'wp_terms_checklist_args', 'show_hierarchical_project_categories', 10, 2 );
    
  21. 多语言中替换显示文字

    <script>
     document.addEventListener('DOMContentLoaded', function() {
        // 选择具有特定 class 和属性的元素
        var link = document.querySelector('a.nturl[data-gt-lang="zh-CN"]');
        // 如果找到该元素
        if (link) {
            // 找到该链接中的文字节点并修改文字
            link.childNodes.forEach(function(node) {
                if (node.nodeType === Node.TEXT_NODE) {
                    node.textContent = 'eeeChinese'; // 修改为需要的文字
                }
            });
        }
    });
    
    </script>
  22. 让图片hover的时候放大,但是不能超过原来的尺寸区域

    .selector {
        overflow: hidden; /* 限制图片放大后不会超出容器 */
        width: 100%; /* 根据需要设置宽度 */
        height: auto; /* 自动高度 */
    }
    
    .selector img {
        width: 100%;
        height: auto;
        transition: transform 0.7s ease; /* 平滑的放大过渡效果 */
    }
    
    .selector:hover img {
        transform: scale(1.2); /* 放大1.1倍 */
    }
    
    
    1. ele的

      selector {
          position: relative;
          overflow: hidden;
          transition: all 0.5s ease;
          cursor: pointer;
      }
      
      selector img {
          width: 100%;
          height: auto;
          transition: transform 0.5s ease;
          transform: scale(1);
      }
      
      selector:hover img {
          transform: scale(1.1);
      }
      
      selector::before {
          content: '';
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background-color: rgba(0, 0, 0, 0.5);
          opacity: 0;
          transition: opacity 0.5s ease;
          z-index: 1;
          pointer-events: none;
      }
      
      selector:hover::before {
          opacity: 1;
      }
      
      selector::after {
          font-family: "Font Awesome 5 Free";
          content: "\f067";
          font-weight: 600;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          color: white;
          font-size: 20px;
          opacity: 0;
          transition: opacity 0.5s ease;
          z-index: 2;
          pointer-events: none;
      }
      
      /*第二个选择*/
      selector::after {
          content: "";
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
      
          width: 90px;
          height: 90px;
      
          background-image: url('https://ho.ddddseo.com/wp-content/uploads/2025/05/chevron-down.svg');
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
      
          opacity: 0;
          transition: opacity 0.5s ease;
          z-index: 2;
          pointer-events: none;
      }
      
      selector:hover::after {
          opacity: 1;
      }
      
  23. 如果一个模块超级长,你想创建一个滚动条,就可以用这个

    .tag-sidebar {
        max-height: 400px; /* 设置侧边栏的最大高度 */
        overflow-y: auto;  /* 启用垂直滚动条 */
        overflow-x: hidden; /* 隐藏水平滚动条,防止内容溢出 */
        padding-right: 10px; /* 为了让滚动条不挡住内容,可以增加一些内边距 */
    }
    
    /* 可选:美化滚动条样式 */
    .tag-sidebar::-webkit-scrollbar {
        width: 8px; /* 滚动条的宽度 */
    }
    
    .tag-sidebar::-webkit-scrollbar-thumb {
        background-color: #888; /* 滚动条颜色 */
        border-radius: 4px; /* 滚动条圆角 */
    }
    
    .tag-sidebar::-webkit-scrollbar-thumb:hover {
        background-color: #555; /* 悬停时滚动条颜色 */
    }
        1. 不是了,只是大家外贸建站的时候,会有各种细节和需求,帮忙处理一下,实现想法而已

  24. blurb拉进图标和文字的距离

    selector.et_pb_blurb_position_left .et_pb_blurb_container {
        padding-left: 1px;
    }
      1. selector {
            display: flex;
            align-items: center; /* 垂直居中 */
        }
        
        selector .et_pb_blurb_content {
            display: flex;
            align-items: center; /* 文字和图片都居中 */
        }
  25. 使用divi的图标库

    <span class="custom-expand-icon et-pb-icon">2</span> <!-- 使用Divi图标 -->
    .custom-expand-icon {
          font-family: 'ETmodules';
          color:#ff0000;
          font-size: 20px;
          cursor: pointer;
          transition: transform 0.3s;
        }
    
  26. 请问怎么把广告账户1的否定关键字列表添加到广告账户2里去呀?几千个词[失望R]而且添加了之后还要保持一样的否定匹配方式,有大神知道怎么操作吗?

  27. 在before的添加,底部添加横线 渐变

    content:"";
    display: inline-block;
        width: 100%;
        position: absolute;
        left: 0px; /* ARRANGE THIS */
        z-index: -1;
        width: calc(100% + 60px);
        background: linear-gradient(90deg,#72c5e2 0%,transparent 50%);
    
    bottom: 16px;
    height: 3px;
  28. 改变复制的选定文字样式

    /*改变复制的选定文字样式*/
    ::selection {
        color: #fff;
        background: #002fa7;
    }
  29. 打开的时候 有icon

    /*faq打开的时候 有icon*/
    .selector .et_pb_accordion_item.et_pb_toggle_open .et_pb_toggle_title:before {
    	display: block;
    	content: "\4d";
      margin-right:0px;
    }
    
  30. woocomerence 的产品相册自动播放

    add_filter( 'woocommerce_single_product_carousel_options', 'filter_single_product_carousel_options' );
    function filter_single_product_carousel_options( $options ) {
        $options['slideshow'] = true;  // 启用自动播放
        $options['animationLoop'] = true;  // 循环播放
        $options['slideshowSpeed'] = 3000;  // 设置切换间隔时间
        $options['pauseOnAction'] = false;  // 禁止手动操作时暂停
        $options['pauseOnHover'] = true;  // 鼠标悬停时暂停播放
        return $options;
    }
    
  31. 谷歌V3验证 消失

    .grecaptcha-badge {
        display: none;
    
    .grecaptcha-badge {
        display: none !important;
        
    }
    }
  32. Image Carousel 样式

    .lwp-slick-slider .slick-dots li button {
    
      border-radius: 3px;
        width: 23px;
        height: 5px;
      opacity: 1.0;
      background-color: #000000 !important;
    }
    
    .lwp-slick-slider .slick-dots li.slick-active button {
        background-color: #4f9cc4 !important;
    }
    
    .lwp_image_carousel_0 .big-slider .slick-slide img, .lwp_image_carousel_1 .big-slider .slick-slide img {
        border-radius: 0px 0px 0px 0px;
        overflow: hidden;
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
    }
  33. 表单跳转不同的页面

    add_action( 'wp_footer', 'wpm_redirect_cf7' );
    function wpm_redirect_cf7() { ?>
        <script type="text/javascript">
        document.addEventListener('wpcf7mailsent', function(event) {
    		
            if ('3255' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-1/';  }
    		
    		   else if ('504' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-2/';  } 
    		
    		   else if ('504' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-1-3/';  }
    		
    		  else if ('233029' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-4/';  }
    		  
    		  else {
                location = '/thank-you/';}   //默认的不选择的时候
    		
        }, false);
        </script>
    <?php }
    
  34. cloudways添加redis 启用

    开头

    define( 'WP_CACHE', true );

    wp-salt.php前面

    define(‘WP_CACHE_KEY_SALT’, ‘ddddseo.com’);
  35. tab的标题前面加图标

    .et-db #et-boc .et-l .et_pb_tabs_controls li a:before {
      font-family: 'ETmodules'; /* Divi图标字体 */
      display: inline-block; /* 使之表现得像内联块 */
      margin-right: 8px; /* 在图标和文本之间添加空间 */
      font-size: 15px; /* 调整图标大小 */
      vertical-align: middle; /* 垂直对齐 */
      color: #ff0000;
    }
    
    .et_pb_tab_0 a:before {
      content: '\5c'; /* 使用Divi图标Unicode */
    }
    
    .et_pb_tab_1 a:before {
      content: '\4c'; /* 使用Divi图标Unicode */
    }
    
    
    .et_pb_tab_2 a:before {
      content: '\45'; /* 使用Divi图标Unicode */
    }
  36. 增加WP的页面

    // 添加一个新的页面类型 例如产品页  文章页  等等带有分类和tag的页面类型
    function create_shoe_post_type() {
      register_post_type('shoe',
        array(
          'labels' => array(
            'name' => __('Shoes'),
            'singular_name' => __('Shoe')
          ),
          'public' => true,
          'has_archive' => true,
          'rewrite' => array('slug' => 'shoes'),
          'supports' => array('title', 'editor', 'thumbnail', 'excerpt', 'comments', 'custom-fields'),
        )
      );
    }
    add_action('init', 'create_shoe_post_type');
    
    
    
    
    function create_shoe_taxonomies() {
      // 添加分类法
      register_taxonomy(
        'shoe_category',
        'shoe',
        array(
          'labels' => array(
            'name' => __('Shoe Categories'),
            'singular_name' => __('Shoe Category'),
          ),
          'hierarchical' => true,
          'rewrite' => array('slug' => 'shoe-category'),
        )
      );
    }
    add_action('init', 'create_shoe_taxonomies');
    
    
    
    function create_shoe_tags() {
      // 添加标签
      register_taxonomy(
        'shoe_tag',
        'shoe',
        array(
          'labels' => array(
            'name' => __('Shoe Tags'),
            'singular_name' => __('Shoe Tag'),
          ),
          'hierarchical' => false,
          'rewrite' => array('slug' => 'shoe-tag'),
        )
      );
    }
    add_action('init', 'create_shoe_tags');
    
    1. acf增加的页面类型,然后添加类目和tag

      function create_taxonomies() {
        // 添加分类法
        register_taxonomy(
          'car_category',
          'car',
          array(
            'label' => __('Car Categories'),
            'rewrite' => array('slug' => 'car-category'),
            'hierarchical' => true,
          )
        );
      
        // 添加标签
        register_taxonomy(
          'car_tag',
          'car',
          array(
            'label' => __('Car Tags'),
            'rewrite' => array('slug' => 'car-tag'),
            'hierarchical' => false,
          )
        );
      }
      add_action('init', 'create_taxonomies');
      
    2. 页面全屏

      .container {
      width: 100%;
      max-width: 100%;
      }
      #left-area .post-meta {
      display: none;
      }
      .entry-title {
      display:none;
      }
      #main-content .container {
      padding-top: 0;
      }
      .container.et_menu_container {
      max-width: 80%;
      }
      
      body:not(.et-tb) #main-content .container, body:not(.et-tb-has-header) #main-content .container {
          padding-top: 0px;
      }
      
      @media (min-width: 981px) {
          #left-area {
              padding-bottom: 0px;
          }
      }
      
  37. 改变博客blog的列数量

    .four-column-blog-grid .et_pb_post {
    display:inline-block;
    vertical-align:top;
    width: 17.5% !important;
    margin-right:2% !important;
    margin-bottom:15px !important;
    background-color: #f2f2f2;
    }
  38. 让图片放大,而且限定在原来的位置

    transform: scale(1.2); /* 将图片放大至11% */
    transition: transform 0.9s ease; /* 添加平滑过渡效果 */
    overflow: hidden; /* 隐藏溢出的部分 */
    position: relative; /* 确保内部元素相对于容器定位 */
    1. 设置class: pa-vertical-align-blurb

      /* Media query for devices with a minimum width of 767 pixels */
      @media (min-width: 767px) {
          /* Flexbox display for blurb content */
          .pa-vertical-align-blurb .et_pb_blurb_content {
              display: flex!important;
          }
          
          /* Flexbox display for blurb container */
          .pa-vertical-align-blurb .et_pb_blurb_container {
              display: flex!important;
              justify-content: center; /* Center align blurb container horizontally */
              flex-direction: column; /* Arrange blurb container content in a column */
          }
          
          /* Flexbox display for main blurb image */
          .et-db #et-boc .et-l .pa-vertical-align-blurb .et_pb_main_blurb_image {
              display: flex;
              width: auto!important; /* Ensure blurb image width adjusts automatically */
              margin-bottom: 0px!important; /* Remove bottom margin for better alignment */
          }
      }
      
    2. 图标在右边

      Add this code to the “Blurb Image”

      margin-left: 12px;

      Add this code to the “Blurb Content”

      display: flex;
      flex-direction: row-reverse;
  39. 1.因不知关键词,未能更清楚一些模块的叫法和术语,想了解更多常用专业术语,举例子:mega menu,hero banner等等。

  40. 随机显示blog帖子, id:random-posts

    function dd_random_posts($query, $args) {
    	if (isset($args['module_id']) && $args['module_id'] === 'random-posts') {
    		$query->query_vars['orderby'] = 'rand';
    		$query->query_vars['order'] = 'ASC';
    		$query = new WP_Query( $query->query_vars );
    	}
    	return $query;
    }
    add_filter('et_builder_blog_query', 'dd_random_posts', 10, 2);
    
    1. <script>
      document.addEventListener("DOMContentLoaded", function() {
          // 选择特定类名下的所有链接
          var links = document.querySelectorAll('.aaaa a');
          // 遍历每个链接,设置其 target 属性为 "_blank"
          links.forEach(function(link) {
              link.target = "_blank";
          });
      });
      </script>
      
    1. 使用下面的代码

      /* 移除默认的列表样式,并添加自定义图标 */
      .selector ul { /* 指定ul,确保应用到正确的元素上 */
        list-style-type: none !important; /* 使用!important确保覆盖默认样式 */
        padding-left: 0 !important; /* 移除内边距 */
      }
      
      /* 单个 */
      .selector ul li{ 
        border-bottom: 0px solid #002fa7;
        margin-bottom: 10px;
      }
       
      .selector ul li::before { /* 目标是li元素的:before */
        content: '\45'; /* 使用Divi图标Unicode */
        font-family: 'ETmodules'; /* Divi图标字体 */
        display: inline-block; /* 使之表现得像内联块 */
        margin-right: 10px; /* 在图标和文本之间添加空间 */
        margin-top:-2px; /* 在图标和文本之间添加空间 */
        font-size: 18px; /* 调整图标大小 */
        vertical-align: middle; /* 垂直对齐 */
        color:#ff0000;
      }
      
  41. 受隐私保护政策影响,自2024年3月起,对于在欧洲地区投放广告的企业和个人,Google将强制要求其推广的所有网站和应用须使用Consent Mode意见征求模式弹窗,以便在同意状态下收集用户数据。目前账户投放的有欧洲市场,需要在3月份之前加一下,不然跟踪不到客户轨迹
    解决方法:
    https://www.termsfeed.com/cookie-consent/

    使用国外的这个平台提供的方法
    JS 代码加在自己的网站上,记的改自己的GA ID, 按钮背景和文字的颜色css也可以改一下

    <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){
    	dataLayer.push(arguments);
    }
    gtag('consent', 'default', {
    	'ad_storage': 'denied',
    	'ad_user_data': 'denied',
    	'ad_personalization': 'denied',
    	'analytics_storage': 'denied'
    });
    </script>
    
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXX改成自己的GA ID"></script>
    <script>
    	window.dataLayer = window.dataLayer || [];
    	function gtag(){dataLayer.push(arguments);}
    
    	gtag('js', new Date());
    	gtag('config', 'G-XXX改成自己的GA ID');
    </script>
    
    <script type="text/javascript" src="//www.termsfeed.com/public/cookie-consent/4.1.0/cookie-consent.js" charset="UTF-8"></script>
    <script type="text/javascript" charset="UTF-8">
    document.addEventListener('DOMContentLoaded', function () {
    cookieconsent.run({"notice_banner_type":"simple","consent_type":"express","palette":"light","language":"en","page_load_consent_levels":["strictly-necessary"],"notice_banner_reject_button_hide":false,"preferences_center_close_button_hide":false,"page_refresh_confirmation_buttons":false,
                       
      "callbacks": {
    	"scripts_specific_loaded": (level) => {
    		switch(level) {
    			case 'targeting':
    				gtag('consent', 'update', {
    					'ad_storage': 'granted',
    					'ad_user_data': 'granted',
    					'ad_personalization': 'granted',
    					'analytics_storage': 'granted'
    				});
    				break;
    		}
    	}
    },
    "callbacks_force": true
                      });
    });
    </script>
    

    css代码修改,样式

    /*同意按钮*/
    .termsfeed-com---palette-light .cc-nb-okagree {
        color: #fff !important;
        background-color: #025ffd !important;
    }
    
    /*拒绝按钮*/
    .termsfeed-com---palette-light .cc-nb-reject {
        color: #333333 !important;
        background-color: #eaeaea !important;
    }
     
    /*窗口*/
    .termsfeed-com---palette-light.termsfeed-com---nb {
        background-color: #ffffff !important;
        color: #111;
      border-radius: 5px 5px 5px 5px;
      border: 1px solid #ff0000;
      box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3); /* 元素的阴影效果 */
    }
     
    /*调整尺寸*/
    .termsfeed-com---nb-simple {
        right: 3%!important;
        top: auto;
        bottom: 5px !important;
        left: 3% !important;
        max-width: 100% !important;
        position: fixed;
    }
     
    /*方位*/
    .termsfeed-com---nb {
        overflow: auto;
        z-index: 99999999999;
        font-size: 16px;
    }
     
    /*内部距离*/
    .termsfeed-com---nb .cc-nb-main-container {
     padding: 10px 30px 10px 30px  !important;
      
    }
     
    /*控制标题*/
    .termsfeed-com---nb .cc-nb-title {
        font-size: 20px !important;
        font-weight: 600;
       /* display: none; 设备注:不想显示标题 就生效这个 */
    }
    .termsfeed-com---reset p {
        margin-top: 0;
        margin-bottom: 5px !important;
    }
     
    /*控制内容*/
    .termsfeed-com---nb .cc-nb-text {
        font-size: 13px !important;
        margin: 0 0 10px 0 !important;
    }
    
    
  42. 如果想改变一些系统wordpress 默认的文案,可以用这个JS

    document.addEventListener('DOMContentLoaded', function() {
        var allTabs = document.querySelectorAll('a.more-link'); // 选择器
    
        allTabs.forEach(function(tab) {
            if (tab.textContent === '了解更多') {
                tab.textContent = 'Your New Text'; // 更改为你想要的文本
            }
        });
    });
    
  43. 想在独立站做一个倒计时的显示区域,需要实时显示秒数的那种

    1. <div id="countdown">
        <span id="days">00</span>天
        <span id="hours">00</span>小时
        <span id="minutes">00</span>分钟
        <span id="seconds">00</span>秒
      </div>
      
      <script>
        function calculateCountdown(endDate) {
          var now = new Date();
          var timeSpan = endDate - now;
      
          if (timeSpan > 0) {
            var days = Math.floor(timeSpan / (1000 * 60 * 60 * 24));
            var hours = Math.floor((timeSpan % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((timeSpan % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((timeSpan % (1000 * 60)) / 1000);
            return { days, hours, minutes, seconds, timeSpan };
          } else {
            return { days: 0, hours: 0, minutes: 0, seconds: 0, timeSpan: 0 };
          }
        }
      
        // 设置结束日期和时间,这里使用的是UTC时间
        var endDate = new Date(Date.UTC(2025, 0, 1, 0, 0, 0));
      
        function updateCountdown() {
          var countdown = calculateCountdown(endDate);
      
          if (countdown.timeSpan <= 0) {
            clearInterval(intervalId); // 停止倒计时
            // 可以添加倒计时结束时的处理逻辑
          }
      
          document.getElementById('days').textContent = countdown.days.toString().padStart(2, '0');
          document.getElementById('hours').textContent = countdown.hours.toString().padStart(2, '0');
          document.getElementById('minutes').textContent = countdown.minutes.toString().padStart(2, '0');
          document.getElementById('seconds').textContent = countdown.seconds.toString().padStart(2, '0');
        }
      
        var intervalId = setInterval(updateCountdown, 1000); // 每秒更新一次倒计时
        updateCountdown(); // 页面加载时立即更新倒计时
      </script>
      
      
    2. <div id="timer">
        <span id="days">00</span>天
        <span id="hours">00</span>小时
        <span id="minutes">00</span>分钟
        <span id="seconds">00</span>秒
      </div>
      
      <script>
        function calculateTimeSince(startDate) {
          var now = new Date();
          var timeSpan = now - startDate;
      
          var days = Math.floor(timeSpan / (1000 * 60 * 60 * 24));
          var hours = Math.floor((timeSpan % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
          var minutes = Math.floor((timeSpan % (1000 * 60 * 60)) / (1000 * 60));
          var seconds = Math.floor((timeSpan % (1000 * 60)) / 1000);
      
          return { days, hours, minutes, seconds };
        }
      
        // 请注意月份是从0开始的,0代表1月,1代表2月,以此类推
        // 例如,下面的时间代表2024年1月1日0时0分0秒
        var startDate = new Date(Date.UTC(2024, 0, 1, 0, 0, 0));
      
        function updateTimer() {
          var time = calculateTimeSince(startDate);
      
          document.getElementById('days').textContent = time.days.toString().padStart(2, '0');
          document.getElementById('hours').textContent = time.hours.toString().padStart(2, '0');
          document.getElementById('minutes').textContent = time.minutes.toString().padStart(2, '0');
          document.getElementById('seconds').textContent = time.seconds.toString().padStart(2, '0');
        }
      
        setInterval(updateTimer, 1000); // 每秒更新一次时间
        updateTimer(); // 页面加载时立即更新时间
      </script>
      
  44. 我用独立站iframe 例如地图或者视频的时候,那个比例始终调不对,宽度100% 高度500px 不同的设备 效果不一样,请问可以解决吗

    1. 用这个

      <div class="video-container">
        <iframe src="your-video-url" frameborder="0" allowfullscreen></iframe>
      </div>
      
      .video-container {
        position: relative;
        width: 100%;
        padding-bottom: 75%; /* 高度是宽度的75% */
        height: 0;
      }
      
      .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
      
  45. 独立站中给一段文字,做样式常用的几个

    .dddd-text {
        margin: 30px 0px 0px 0px;
        padding: 1px 10px 1px 10px;
        background-color: #d1d1d100;
        text-align: left;
        color: #333333;
        font-size: 20px;
        line-height: 1.8em;
        border: 1px solid #dddddd;
        border-radius: 0px 0px 0px 0px;
        box-shadow: 0px 0px 0px 0px #f40707;
        transform: scale(1.00,1.00);
    }
    
  46. 产品页面添加作者

    unction add_author_support_to_products() {
       add_post_type_support( 'product', 'author' ); 
    }
    add_action( 'init', 'add_author_support_to_products' );
    
  47. blog图片缩略图用800×420
    为了在高分辨率设备上呈现出完美效果,建议使用尺寸至少为 1200 x 630 像素的图片。您应该使用尺寸至少为 600 x 315 像素的图片,以展示附有更大图片的链接式公共主页帖子。

  48. 产品缩略图自定义数量

    .woocommerce div.product div.images .flex-control-thumbs li {
        width: 15%;
        margin-right: 2%;
        margin-bottom: 2%;
    }
    
    .woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) {
        clear: left;
        clear: none;
    }
    
    .woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(6n+1) {
        clear: left;
    
    }
    
    .woocommerce div.product div.images .flex-control-thumbs li:nth-of-type(4n) {
        margin-right: 2%;
    }
    
    .woocommerce div.product div.images .flex-control-thumbs li:nth-of-type(6n) {
        margin-right: 0;
    }
    
    
    .woocommerce div.product div.images .flex-control-thumbs li img.flex-active, .woocommerce div.product div.images .flex-control-thumbs li img:hover {
        border-width: 1px;
      border-color: #ff0000;
    }
    
    1. pip install pandas
      pip install openpyxl
      pip install xlrd
      pip install xlwt

      pip install pandas openpyxl xlrd

      处理excel表格的

  49. blog页面如果想解释图片的详细

    <div class="blog_image">
    <img class="wp-image-10552 alignnone size-full" src="https://unblast.com/wp-content/uploads/2023/11/Tear-off-Envelope-Mockup-1536x1024.jpg" alt="xxxxxxx" width="720" height="540" />
    图片描述的<cite>©<a href="https://unblast.com/tear-off-envelope-mockup/" rel="nofollow ugc">写引用的图片地址</a></cite>
    </div>
    
    .blog_image{
      text-align: center;
      line-height: 1.2em;
      margin-bottom: 4%;
      font-size: 15px;
    }
    
  50. 实现普通的图片,鼠标经过的时候,显示自己的文字,图片要打开点击图片功能

    .pa-image-hover-text .et_overlay.et_pb_inline_icon:before {
    	content: "iam text show";
    	font-family: inherit !important;
    	font-size: 24px;
    	line-height: 1.3em;
    	text-align: center;
    	transform: translateX(-50%) translateY(-50%);
    	margin-left: 0px;
    	width: 80%;
    }
  51. 按钮并列

    .ddddbutton
    .et_pb_button_module_wrapper {
    display: inline-block;
    }
    
      .ddddbutton
    .et_pb_image  {
    display: inline-block;
    }
    
  52. 左右排列结构,图文左右交错的时候,在手机上要变成图片在上的解决

    中框加

    display: flex;
    flex-wrap: wrap;
    

    列的顺序分别加用
    order: 1;
    order: 2;
    order: 3;
    进行手动排序

    1. width: 48% !important;
      float: left !important;
      margin-right: 2% !important;
      

      手机 2列 放在所在的列

  53. Davis你好,感觉b2b企业很难做seo啊,产品单一,页面少,有没有b2b做的还不错的网站可以参考的吗
    然后还有一个就是,如果把title设计成h1标签,是不是浪费了这个标签的重要性?关于h1标签可以给讲一下吗,谢谢

    1. 做的好的b2b 网站太多了,加我微信 可以给你一些
      关于title 和 H1 其实是2个东西,一个是页面放在谷歌搜索结果的叫做title, H1其实是页面内容的最大标题

  54. 手动做一个按钮

    <a href="#" target="_blank" rel="noopener" class="button_blog">联系我获取报价</a>
    /*作者的按钮*/
    .button_blog {
        display: inline-block;
        padding: 10px 20px;
        font-size: 16px;
        color: #ffffff !important; 
        background-color: #002fa7;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        text-decoration: none;
    }
    .button_blog:hover {
        background-color: #333333;
    	transform: scale(1.03, 1.03);
    }
  55. 侧边栏菜单 折叠样式设计

    .menu-product_page-container .sub-menu {
        display: none;
    }
    .menu-product_page-container li.menu-item-has-children:hover > .sub-menu {
        display: block;
    }
    .menu-product_page-container li.menu-item-has-children:before{
       font-family: ETmodules;
       content: "\43";
       position: absolute;
       right: 5px;
    }
  56. woocommerce_items_in_cart
    火箭缓存有的时候,更新采购车数量不及时,可以用这个放在不缓存的cookie

  57. 让按钮或者文字动起来

    animation-name: left;
        animation-duration: 3s;
        animation-iteration-count: infinite;
        animation-timing-function: ease-in-out;
        margin-left: 0px;
        margin-top: 0px;
    }
    
    @keyframes left {
        from { transform: translate(0, 0px); }
        50%  { transform: translate(-15px, 0px); }
        to   { transform: translate(0, 0px); }
    
    1. animation: bouncing 1.0s cubic-bezier(0.1, 0.05, 0.05, 10) 0s infinite alternate both;

      另外一个也能实现

  58. 隐藏后台地址

    add_action('login_enqueue_scripts', 'tb_wp_login_protection');
    function tb_wp_login_protection(){
        if( !isset($_GET['ddddseo']) ){
            header('Location: https://www.google.com');
            exit;
        }
    }

    域名/wp-login.php?ddddseo, 改成这个了, 输错就到谷歌

  59. 设置一个区域,鼠标放上产生变化

    .left-pro ul li:before {
        border-top: 2px solid #29b6f6;
        border-bottom: 2px solid #29b6f6;
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform: scale(0,1);
        -webkit-transform: scale(0,1);
    }
    .left-pro ul li:before, .left-pro ul li:after {
        content: '';
        display: block;
        position: absolute;
        top: -2px;
        left: 2px;
        right: -2px;
        bottom: -2px;
        transition: all .5s;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        opacity: 0;
    }
  60. 用于主推的一些场景

    产品菜单Updated

    产品菜单Hot

    产品菜单<sup><span style="color: #ffffff;font-size: 5px;line-height: 1.4em!important;background-color: #ff0000;">Hot</span></sup>
  61. Woocommerce的结算单定制

    /**
     * Edit Billing Details to Remove Fields You Dont Want 
     **/
    function njengah_remove_checkout_fields( $fields ) {
    
        // Billing fields
        // 账单的显示
        
        unset( $fields['billing']['billing_company'] );
        // unset( $fields['billing']['billing_phone'] );
        unset( $fields['billing']['billing_state'] );
        // unset( $fields['billing']['billing_first_name'] );
        unset( $fields['billing']['billing_last_name'] );
        unset( $fields['billing']['billing_address_1'] );
        unset( $fields['billing']['billing_address_2'] );
        unset( $fields['billing']['billing_city'] );
        unset( $fields['billing']['billing_postcode'] );
    	
    	
    	// 修改显示的那个文字
    	$fields['billing']['billing_last_name']['label'] = '微信号';
    	$fields['billing']['billing_first_name']['label'] = '姓名';
    	//$fields['billing']['billing_city']['label'] = '姓名2342';
    	
    	
    	
    	
    	
    	// Shipping fields
    		unset( $fields['shipping']['shipping_company'] );
    		// unset( $fields['shipping']['shipping_phone'] );
    		unset( $fields['shipping']['shipping_state'] );
    		// unset( $fields['shipping']['shipping_first_name'] );
    		unset( $fields['shipping']['shipping_last_name'] );
    		unset( $fields['shipping']['shipping_address_1'] );
    		unset( $fields['shipping']['shipping_address_2'] );
    		unset( $fields['shipping']['shipping_city'] );
    		unset( $fields['shipping']['shipping_postcode'] );
    
                    // Order fields
                    // unset( $fields['order']['order_comments'] );
    	
    	return $fields;
    	
    } 
    	add_filter( 'woocommerce_checkout_fields', 'njengah_remove_checkout_fields' ); 
    
    add_filter( 'woocommerce_checkout_fields', 'bbloomer_required_woo_checkout_fields' );
    
    
    //  必选项
    function bbloomer_required_woo_checkout_fields( $fields ) {
    	
    	
        $fields['billing']['billing_first_name']['required'] = false;	
    	 //$fields['billing']['billing_email']['required']   = false;
    	//$fields['billing']['billing_city']['required']      = false;
    	//$fields['billing']['billing_postcode']['required']  = false;
    	//$fields['billing']['billing_country']['required']   = false;
    	//$fields['billing']['billing_state']['required']     = false;
    	//$fields['billing']['billing_address_1']['required'] = false;
    	//$fields['billing']['billing_address_2']['required'] = false;
    	
    	
    	
        return $fields;
    }
    
    
    
    /**
    * Billing Checkout Fields
    */
          //billing_first_name
          //billing_last_name
          //billing_company
          //billing_address_1
          //billing_address_2
          //billing_city
          //billing_postcode
          //billing_country
          //billing_state
          //billing_email
          //billing_phone
     
    /**
    * Shipping Checkout Fields
    */
          //shipping_first_name
          //shipping_last_name
          //shipping_company
          //shipping_address_1
          //shipping_address_2
          //shipping_city
          //shipping_postcode
          //shipping_country
          //shipping_state
     
    /**
    * Account Checkout Fields
    */
          //account_username
          //account_password
          //account_password-2
     
    /**
    * Order Checkout Fields
    */
          //order_comments
    
    
  62. width: 10%!important;

    I started with 4 columns set to 1/4 each.
    In the row sizing, I set the row with and max-width to 100%.
    While I was there I changed the gutter to 1.
    In the first column with the logo, I set the width to 10%.
    The second column with the menu is larger, so I set the width to 65%.
    In the third column with the button, I set the width to 10%.
    Lastly, in the fourth column with the social follow, I set the width to 15%.

    如何设置列的自定义宽度
    https://www.peeayecreative.com/how-to-resize-divi-column-widths/

  63. tag的数量限制突破,解决方案

    function set_widget_tag_cloud_args($args) {
        $my_args = array(
            'orderby'  => 'count',
            'order'    => 'DESC',
            'number'   => 500
            );
        $args = wp_parse_args( $args, $my_args );
        return $args;
    }
    add_filter('widget_tag_cloud_args','set_widget_tag_cloud_args');
    add_filter('woocommerce_product_tag_cloud_widget_args','set_widget_tag_cloud_args');
  64. 竖着

    横着

  65. 6列产品生效

    .woocommerce-page.columns-6 ul.products li.product, .woocommerce.columns-6 ul.products li.product 
    { 
    width: 15%!important; 
    margin: 0 2% 2.992em 0 !important; 
    } 
    .woocommerce.columns-6 ul.products li.product.last {
    margin-right: 0 !important;
    } 
    .et_right_sidebar.woocommerce-page #main-content .woocommerce-page.columns-6 ul.products li.product:nth-child(3n+1), .et_right_sidebar.woocommerce-page #main-content .woocommerce.columns-6 ul.products li.product:nth-child(3n+1)  { clear:none !important; 
    }
    .et_full_width_page.woocommerce-page ul.products li.product:nth-child(4n+1), .et_left_sidebar.woocommerce-page #main-content ul.products li.product:nth-child(3n+1), .et_right_sidebar.woocommerce-page #main-content ul.products li.product:nth-child(3n+1) {
        clear: none;
    }
    

    5列产品生效

    .woocommerce-page.columns-5 ul.products li.product, .woocommerce.columns-5 ul.products li.product { width: 16.95%!important; margin: 0 3.8% 2.992em 0 !important; } .woocommerce.columns-5 ul.products li.product.last { margin-right: 0 !important; } .et_right_sidebar.woocommerce-page #main-content .woocommerce-page.columns-5 ul.products li.product:nth-child(3n+1), .et_right_sidebar.woocommerce-page #main-content .woocommerce.columns-5 ul.products li.product:nth-child(3n+1)  { clear:none !important; }
    
  66. 改变评论区的文字

    <script>
    jQuery(document).ready(function(){
    jQuery(".ddddseoco #et_pb_submit").html('CUSTOM SUBMIT BUTTON TEXT GOES HERE');
    jQuery(".ddddseoco #reply-title span").html('CUSTOM TITLE TEXT GOES HERE');
    });
    </script>
  67. Davis你好,对于外链的选择有什么推荐吗,在fiverr上也不知道怎么挑,感觉不知道从何下手。

    1. 首先做外链先确保一个事情,就是内容要做的很好情况下再考虑外链。Fiverr上普遍都是那种垃圾的外链,现在谷歌对于垃圾的外链很打击。 现在做外链的原则是质量大于数量,我自己的外链大部分都是我的网站内容的图片好看,被别人拿去做借用,给我的外链,都是行业高度相关的。 有条件的话,去好的外链的平台找吧,别在Fiverr上找,价格高的普遍质量还行

  68. 图标靠左的代码,用于FAQ板块

    /*move the toggle icon to the left*/
    
    .pa-toggle-icon-left .et_pb_toggle_title:before {
    	left: 0 !important;
    }
    /*adjust spacing on the left for the icon*/
    
    .pa-toggle-icon-left .et_pb_toggle_title,
    .pa-toggle-icon-left .et_pb_toggle_content {
    	padding-left: 2em !important
    }
    
    /*move the accordion icon to the left*/
    
    .pa-accordion-icon-left .et_pb_toggle_title:before {
    	left: 0 !important;
    }
    
    
    /*adjust spacing on the left for the icon*/
    
    .pa-accordion-icon-left .et_pb_toggle_title,
    .pa-accordion-icon-left .et_pb_toggle_content {
    	padding-left: 2em !important
    }
  69. 第一次新建post,我才写了文章的标题,页面自动跳转显示(编辑器遇到意外错误),这个怎么解决呢?

    1. 编辑器插件可以先暂定,然后看看正常不。 如果可以了,那就编辑器插件的问题,是正版的吗?

  70. 图片列表不要自动裁剪

    function wpc_remove_height_cropping($height) {
    	return '9999';
    }
    function wpc_remove_width_cropping($width) {
    	return '9999';
    }
    
    add_filter( 'et_pb_gallery_image_height', 'wpc_remove_height_cropping' );
    add_filter( 'et_pb_gallery_image_width', 'wpc_remove_width_cropping' );
    
    1. Projects的缩略图尺寸修改

      add_filter( 'et_pb_portfolio_image_height', 'portfolio_size_h' );
      add_filter( 'et_pb_portfolio_image_width', 'portfolio_size_w' );
      
      function portfolio_size_h($height) {
      	return '300';
      }
       
      function portfolio_size_w($width) {
      	return '300';
      }
    2. gallery的列数

      @media only screen and ( min-width: 768px ) {
      
      .three-column-grid .et_pb_grid_item {
      width: 28.333% !important;
      margin: 0 7.5% 7.5% 0 !important;
      }
       
      .three-column-grid .et_pb_grid_item:nth-child(3n) {
      margin-right: 0 !important;
      }
      
      .three-column-grid .et_pb_grid_item:nth-child(3n+1) {
      clear: left;
      }
      
      .three-column-grid .et_pb_grid_item:nth-child(4n+1) {
      clear: unset !important;
      }
      
      }
  71. 搜索结果中要包含product和project

    function custom_remove_default_et_pb_custom_search() {
    	remove_action( 'pre_get_posts', 'et_pb_custom_search' );
    	add_action( 'pre_get_posts', 'custom_et_pb_custom_search' );
    }
    add_action( 'wp_loaded', 'custom_remove_default_et_pb_custom_search' );
    
    function custom_et_pb_custom_search( $query = false ) {
    	if ( is_admin() || ! is_a( $query, 'WP_Query' ) || ! $query->is_search ) {
    		return;
    	}
    
    	if ( isset( $_GET['et_pb_searchform_submit'] ) ) {
    		$postTypes = array();
            
    		if ( ! isset($_GET['et_pb_include_posts'] ) && ! isset( $_GET['et_pb_include_pages'] ) ) {
                $postTypes = array( 'post' );
            }
    
    		if ( isset( $_GET['et_pb_include_pages'] ) ) {
                $postTypes = array( 'page' );
            }
    
    		if ( isset( $_GET['et_pb_include_posts'] ) ) {
                $postTypes[] = 'post';
            } 
    
    		/* BEGIN Add custom post types */
    		$postTypes[] = 'product';
                  $postTypes[] = 'project';
    		/* END Add custom post types */
    
    		$query->set( 'post_type', $postTypes );
    
    		if ( ! empty( $_GET['et_pb_search_cat'] ) ) {
    			$categories_array = explode( ',', $_GET['et_pb_search_cat'] );
    			$query->set( 'category__not_in', $categories_array );
    		}
    
    		if ( isset( $_GET['et-posts-count'] ) ) {
    			$query->set( 'posts_per_page', (int) $_GET['et-posts-count'] );
    		}
    	}
    }
    
  72. 让中列垂直居中的方法,分列的css加, 对齐

    margin: auto;

    中框加

    多个居中对齐,在最大的中框加这个

    align-items: center;

    底部对齐

    align-items: flex-end;
    1. 第二种对齐居中方法, 占满

      display: flex;
      flex-direction: column;
      justify-content: center;
      
    2. 所属的列加这个,无限叠加和对齐

      display: flex;
      align-items: center; /* (flex-start | flex-end | center | baseline | stretch) */
      justify-content: center;
      
    3. 第三种方法,罗列叠加

      所属的列加

      display: flex;
          flex-wrap: wrap; /* 允许子项换行 */
          /*align-items: center;*/
          /*justify-content: center;*/

      黑色元素加

       flex: 0 0 20%; /* 不允许项目增长或缩小,并设置基础大小为容器宽度的20% */
          /* 如果容器宽度允许,这将确保每行容纳5个项目 */
          /* 您也可以设置为flex-basis: 20%; 如果您不想使用flex缩写属性 */
        
  73. 如果想定义某一个区域内的所有链接都要新窗口打开,就定义class,“ddddseo-newtab”.
    然后加js代码

    <script>
    jQuery(document).ready(function(){
        jQuery(".ddddseo-newtab a").each(function(){
            jQuery(this).attr("target", "_BLANK");     
        })
    })
    </script>
  74. 我们做网站的时候,放youtube视频,视频结束后,会推荐其他同行的视频,相信这个是很多人的痛点。 我找一个方法 亲测 很有用,视频结束后只会推荐自己的频道视频,好用的很。
    给油管的视频元素加class, 叫做 “yincang-ddddseo-videos”

    然后加JS代码

    <script>
    jQuery(document).ready(function($ ) {
    $('.yincang-ddddseo-videos iframe').attr( "src", function( i, val ) {
    return val + '&rel=0';
    });
    });
    </script>
    1. <script>
      jQuery(document).ready(function($ ) {
      $('.et_pb_video iframe').attr( "src", function( i, val ) {
      return val + '&rel=0';
      });
      });
      </script>
      
    1. manufacturer
      factory
      supplier
      wholesale
      distributor
      china
      seller
      maker
      company
      dealer
      europe
      vendor
      purchase
      import
      export
      hs code

      我这边有一些可以参考

  75. 你好,如果我想wordpress的网站显示语言是中文,后台的编辑是英文,怎么设置呀?

    1. 这种情况下,有一个方式就是,在wordpress后台的Users上找到自己的个人资料,把个人资料的语言设置成英语,就可以实现你的这个想法

      1. 站点语音设置成中文的 用户语音设置成英文的就可以实现这个效果了吗?

    1. 其实只要把页面的wordpress的默认评论功能给它打开,然后在页面中布局上这个评论元素,就成为了具有论坛功能的页面,大家自由讨论和回复。
      就像我的这个讨论页面一样,另外如果用论坛功能的话,其实可以使用二级域名新开一个网站,用Discuz来建这个网站,就是完整的论坛功能。

  76. 网站的收录特别慢,post和page发布后,要等很久才能收录,咋回事

    1. 你可以使用Google Search Console 网站检查功能,当输入网址后,如果提示没有被收录,你可以点击“请求编入索引”这个按钮,正常你的网站没有被惩罚的情况下,这个手动收录还是蛮有用的,我的一些外贸站,有的时候5分钟就被收录了

  77. 你好,请问有没有好用的备份网站的插件,最好是能备份到本地电脑的

    1. 我推荐用Duplicator插件

      1. 备份简单,只需要简单的设置就可以完成本地的网站备份,可以设置密码,大家备份的大小很大的话,有时会备份不成功,告诉大家一个小技巧,upload这个网站文件夹可以不做备份,剔除后备份文件就变小了。

      2. 恢复很简单,只需要根据一个恢复php文件,就可以一直下一步来恢复网站

      3. 那个upload文件夹可以在网站恢复好,然后把upload的文件直接覆盖掉就行了。

  78. Daivs, 你好,我也是用了divi主题,我看到别人的菜单有一个效果,我也想实现,就是一级菜单能展开成3列或4列,全屏显示的,我在主题设置里面没找到,请问你知道怎么做吗?

      1. 那个我做完正常下拉怎么都是粗体字还有颜色是不是可以单独改浅一点

        1. 可以F12 找到css的id,然后修改color 还有字体的css参数设置,例如: font-weight: 500; 这种

  79. youtube的底层流量推荐逻辑是什么?新手做YouTube应该注意什么?

    1. 底层逻辑就是你的视频内容是有用的,有价值的,能看的下去的。 youtube后台有一个数据就是每个用户看视频的百分比,例如优秀的视频很多人都能给看90%,没有略过快进之类的, 假设你的是视频大部分用户都看了10%以下,基本看不完就走了,那么谷歌就认为你这个是垃圾的内容,基本是不会给推荐和排名的,所以优质的内容是前提。
      新手做的话:别触碰谷歌的规则,不能抄袭别人的是视频,背景或者片段音乐都有版权的,这个要注意,给个小建议给你,youtube有一个免费的音乐库,用那个里面的音乐。 另外视频全部原创自己拍,自己剪辑,剪辑软件可以用Pr,我用的就是这个,希望能帮助到你

  80. 想搭建一个综合所有同行的服务&价格&物流等对比信息的网站,方便用户筛选,有可以借鉴的比较成熟的网站吗

    1. 这个我建议哈:直接谷歌搜索你的这个服务类型的关键词,查看第一页的搜索结果大家做的网站是什么样的,基本上第一页符合谷歌对于你的搜索意图的分析得出的结论,可以直接借鉴首页的网站,如果大家都是文章页,你就要布局文章页,如果是其他的类型的内容,我们可以直接借鉴来做。

  81. 你好,我有一个问题很棘手,客户的留言表单一直发送不成功,很急。。。

    但是,如果我登录了我的后台,去测试询盘留言表单的发送功能,每次都测试都成功,这怎么解决呀,站长

  82. 你好,Davis。我去年签约了一家服务商,按照约定,他们做了100个关键词到首页,可是这些词都不合理(因为我们不能指定关键词)。现在一年了,也没收到有效的询盘,偶尔收到的也都是垃圾询盘,推销类的。这种情况怎么办呢?如果直接不要这个网站了,又感觉可惜,花了很多钱呢。。。

    1. 你好,这个事情的缘由呢,我在网站的首页有分析这个为啥什么没有询盘,你可以去看一下,网址是:https://ddddseo.com/ ,这种情况,我建议你看能不能要回一些款回来, 另外这个网站其实是废了,不要感觉到可惜。
      不如你自己从新建立一个完全属于自己的网站,赶紧吧,时间不等人,走正确的路,有啥疑问可以私我

    1. 1. 域名其实在哪里注册都差不多,但是要选择大公司的,我们走外贸的话,我挺建议用国外的注册商的,不要备案,随时可注册,还保护隐私,我首推荐namesilo,每年现在9.8美金每年一年,包含隐私保护,还是国际知名的注册商,不怕跑路,PS: 我个人注册了十几个域名了,有点上瘾,别学我,捂脸。。

      2. 服务器的话,我买过siteground, hostinger, 和cloudways, 都是比较知名的几个。 我最后选择了cloudways, 因为速度相对快,相当于优化后的VPS,有独立ip,外贸人用14.5美金一个月的就行,我放了3个网站,都挺流畅的。

  83. Davis,你好。有没有好用的视频编辑软件分享一下呀,我的诉求是剪辑,配字幕,最好还要配音,需要怎么做呢?非常感谢!

    1. 视频剪辑的话,我推荐用Adobe家的Pr软件,这个是专业的视频剪辑,简单上手,属于非常专业级别的。 我们做外贸的只要会操作基本的就行了例如: 剪辑,加文字,加音乐,我认为就可以了,做外贸的视频足够的。 友情提醒一下: youtube更喜欢4K格式的视频哦,未来的考虑,所以请拍一些高清的素材来做,保证效果很好,独家经验,有不明白或者操作细节可以私下找我详细了解

    1. 这个问题其实回答起来,挺简单的,我们就用人数用的最多的那些,因为啥呢,使用过程中遇到疑问能很容易,找到同样问题的前辈解答信息,不推荐用小众的。
      目前主流的有Astra, DIVI, Avada 等等, 站长经常使用和本网站使用的都是DIVI

  84. 我是第一条评论,大家有问题可以直接提问,我会公开回答大家的问题

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

170 回复

  1. icon list 上传svg无法改颜色的时候

    selector .elementor-icon-list-icon svg path {
        fill: inherit !important;
    }
  2. 外贸独立站最流行的谷歌字体

    “Montserrat”, “Poppins”, “Inter”, “Roboto”, “Open Sans”, “Oswald”,
    “Lato”, “Outfit”,”Source Sans Pro”, “Raleway”, “Jost”, “Noto Sans”, “Merriweather”,
    “Ubuntu”, “Playfair Display”, “Lora”, “Nunito”, “PT Sans”, “Rubik”, “Kanit”,
    “Work Sans”, “Quicksand”, “PT Serif”, “Noto Serif”, “Titillium Web”, “Heebo”,
    “Oxygen”, “Dosis”, “Bebas Neue”, “Karla”, “Josefin Sans”, “Libre Baskerville”,
    “Anton”, “Cairo”, “Bitter”, “Mukta”, “Abel”, “Hind”, “Pacifico”, “Prompt”,
    “Arvo”, “EB Garamond”, “Crimson Text”, “Exo 2”, “Barlow”, “Caveat”, “Dancing Script”,
    “Orbitron”, “Questrial”, “Catamaran”, “Maven Pro”, “Righteous”, “Rajdhani”,
    “Cormorant Garamond”, “Teko”, “Indie Flower”, “Signika”, “Cinzel”, “Archivo”,
    “Passion One”, “Domine”, “Inter”, “Yellowtail”, “Patua One”, “Cardo”, “Asap”,
    “Alfa Slab One”, “Volkhov”, “Philosopher”, “Zilla Slab”, “Merienda”, “Kalam”,
    “Russo One”, “Vidaloka”, “Alegreya”, “Lobster”, “Bree Serif”, “Crete Round”,
    “Saira”, “Spectral”, “Courgette”, “Noticia Text”, “Amatic SC”, “Sacramento”,
    “Architects Daughter”, “Shadows Into Light”, “Gloria Hallelujah”, “Abril Fatface”

  3. hover框架内部的css改变

    selector:hover .elementor-icon {
        color: #ffffff !important;
        fill: #ffffff !important; 
        border-color: #ffffff !important;  
    }
    
    
    selector:hover h3 {
        color: #f5f5f5 !important;
    }
    
    selector:hover p {
        color: #f5f5f5 !important;
    }
    
  4. /*跳转模块的时候#,预留顶部的距离*/
    :target {
      scroll-margin-top: 70px !important;
    }
    
  5. ele中 单独控制图标 svg的样式

    selector .elementor-icon {
    margin-top: 10px;
    }
  6. ele的filter 选项无法换行的解决

    .e-filter {
      flex-wrap: wrap !important; 
    }
    
  7. ele中的点Carousel 改变点的大小 颜色

    selector .swiper-pagination-bullet {
        border-radius: 0px;
    width: 10px;
    height: 10px;
    }
    
    selector .swiper-pagination-bullet-active {
        opacity: 1;
        background: #ff00ff !important;
        width: 90px !important;
    }
    
  8. 表单中美化方框选定

    
    /* 表单整体居中 */
    .elementor-form .elementor-field-group {
      text-align: center;
    }
    
    /* 选项容器:竖直排列,居中对齐 */
    .elementor-form .elementor-field-subgroup {
      
      text-align: left;
      margin: 6px 0;
    }
    
    /* 复选框:方形、边框加粗,没有圆角 */
    .elementor-form input[type="checkbox"] {
      width: 16px;
      height: 16px;
      margin-right: 5px;
      vertical-align: middle;
      appearance: none;         /* 去掉浏览器默认样式 */
      -webkit-appearance: none;
      border: 1px solid #000;   /* 黑色边框 */
      border-radius: 0;         /* 去掉圆角,保持方形 */
      background: #fff;
      cursor: pointer;
    }
    
    /* 选中状态:填充黑色或你想要的颜色 */
    .elementor-form input[type="checkbox"]:checked {   
        background-image: url(https://dulizhanchaoshi.com/wp-content/uploads/2025/06/check.svg);
        background-repeat: no-repeat;    
        background-color: #000000;
        background-size: 0.95rem;
    }
    
    /* 复选框对应文字 */
    .elementor-form .elementor-field-option {
    
      font-size: 14px;
      font-weight:500;
      vertical-align: middle;
      color:#222222;
    }
    
  9. D哥好~
    想请教一下,我想要在网站上面搞一个视频类目,里面分类好产品视频、公司视频、研发、测试视频、安装教程等。考虑到YouTube嵌入可能会有广告之类的,想直接在网站上面内嵌,这样是不是要升级一下服务器?我用的是某个服务器专业版的套餐。

    同时,我也问了一下gpt,它给我的建议是:更划算、稳定的做法是把视频托管给专业的视频/CDN 服务(Cloudflare Stream / Vimeo / YouTube),并把媒体从 WordPress 媒体库“外放”到云存储或 CDN(用 WP 插件),这样能保证播放流畅又不占用你现有主机资源。

    想听听你的意见

  10. ele的loop中单独展示几个热销的,按照这个做

    add_action('elementor/query/dddd_custom_query', function( $query ) {
        $post_ids = array(2024,1966); // 你的自定义产品 ID
        $query->set('post__in', $post_ids);
        $query->set('orderby', 'post__in'); // 保持顺序
    });
  11. 顶部的倒三角箭头

    .d2304-link-list:after {
    
    position: absolute;
    left: 50%;
    margin-left: -20px;
    top: -10px;
    width: 0;
    height: 0;
    content: '';
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #ffffff;
    
    }
  12. 想要设置WP后台登陆地址,还要到期的

    add_action('login_enqueue_scripts', 'custom_login_keyword_expiry_hours');
    function custom_login_keyword_expiry_hours() {
        // 设置中国东八区时区
        date_default_timezone_set('Asia/Shanghai');
    
        // 每个关键词 => [起始时间戳, 有效小时数]
        $login_keys = [
            'banana' => [strtotime('2025-06-07 10:00:00'), 35], // 有效35小时
            'apple'  => [strtotime('2025-06-07 08:00:00'), 12], // 有效12小时
            'mango'  => [strtotime('2025-06-07 09:30:00'), 6],  // 有效6小时
        ];
    
        $now = time(); // 当前时间戳(东八区)
    
        foreach ($login_keys as $key => [$start_time, $valid_hours]) {
            if (isset($_GET[$key])) {
                $expire_time = $start_time + ($valid_hours * 3600);
                if ($now < $expire_time) {
                    return; // ✅ 允许访问
                } else {
                    wp_die("登录链接 '$key' 已于 " . date('Y-m-d H:i:s', $expire_time) . " 过期。", '链接已过期', ['response' => 403]);
                }
            }
        }
    
        // ❌ 如果没有匹配参数或过期
        wp_redirect(home_url('/'));
        exit;
    }
    
    
  13. ele超级菜单居中

    .elementor-widget-n-menu .e-n-menu-content>.e-con {
         position: fixed !important;
      left: 50% !important;
      transform: translateX(-50%) !important;
    }
  14. 让文字限制几行的方式

    /* 通用样式:设置为多行省略号 */
    .d1011 {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      -webkit-line-clamp: 3; /* 默认桌面显示 3 行 */
    }
    
    /* 平板:最多显示 2 行 */
    @media (max-width: 1024px) {
      .d1011 {
        -webkit-line-clamp: 2;
      }
    }
    
    /* 手机:最多显示 1 行 */
    @media (max-width: 767px) {
      .d1011 {
        -webkit-line-clamp: 1;
      }
    }
    1. 另外一个方案2

      
      selector {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
      
        overflow: hidden;
        text-overflow: ellipsis;
      }
      
      
  15. 禁止右键复制的

    <script>
    document.addEventListener('contextmenu', function(e) {
      e.preventDefault();
    });
    </script>
    
  16. ele tab把click换成hover, hoverTabs为前缀

    <script>
    
    document.addEventListener('DOMContentLoaded',function(){
    jQuery(function($){
    $('.hoverTabs .e-n-tab-title').mouseenter(function(){
    $(this).click();
    });
    });
    });
    </script>
    
  17. 上滑下滑停留 隐藏显示,上滑就显示菜单

    /* 确保 Sticky Header 过渡效果 */
    /* 确保 Sticky Header 过渡效果 */
    .dd1130-sticky-header {
        transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    }
    
    /* 当下滑时隐藏 */
    .dd1130-sticky-header.dd1130-hidden {
        opacity: 0;
        transform: translateY(-100%);
        pointer-events: none; /* 避免影响交互 */
    }
    
    
    1. document.addEventListener("DOMContentLoaded", function () {
          let lastScrollY = window.scrollY;
          let header = document.querySelector(".dd1130-sticky-header");
      
          if (!header) return; // 确保 header 存在
      
          window.addEventListener("scroll", function () {
              if (window.scrollY > lastScrollY) {
                  // 下滑隐藏
                  header.classList.add("dd1130-hidden");
              } else {
                  // 上滑显示
                  header.classList.remove("dd1130-hidden");
              }
              lastScrollY = window.scrollY;
          });
      });
      
      
  18. ele 隐藏页面的默认标题

    function ele_disable_page_title( $return ) {
    return false;
    }
    add_filter( 'hello_elementor_page_title', 'ele_disable_page_title' );
    
  19. 丝滑滚动的ele

    selector .swiper-wrapper {
    -webkit-transition-timing-function: linear!important;
    transition-timing-function:linear!important;
    }
  20. Project显示层级

    function show_hierarchical_project_categories( $args, $post_id ) {
        if ( 'project' === get_post_type( $post_id ) ) {
            $args['checked_ontop'] = false; // 禁止选中的分类固定在顶部
        }
        return $args;
    }
    add_filter( 'wp_terms_checklist_args', 'show_hierarchical_project_categories', 10, 2 );
    
  21. 多语言中替换显示文字

    <script>
     document.addEventListener('DOMContentLoaded', function() {
        // 选择具有特定 class 和属性的元素
        var link = document.querySelector('a.nturl[data-gt-lang="zh-CN"]');
        // 如果找到该元素
        if (link) {
            // 找到该链接中的文字节点并修改文字
            link.childNodes.forEach(function(node) {
                if (node.nodeType === Node.TEXT_NODE) {
                    node.textContent = 'eeeChinese'; // 修改为需要的文字
                }
            });
        }
    });
    
    </script>
  22. 让图片hover的时候放大,但是不能超过原来的尺寸区域

    .selector {
        overflow: hidden; /* 限制图片放大后不会超出容器 */
        width: 100%; /* 根据需要设置宽度 */
        height: auto; /* 自动高度 */
    }
    
    .selector img {
        width: 100%;
        height: auto;
        transition: transform 0.7s ease; /* 平滑的放大过渡效果 */
    }
    
    .selector:hover img {
        transform: scale(1.2); /* 放大1.1倍 */
    }
    
    
    1. ele的

      selector {
          position: relative;
          overflow: hidden;
          transition: all 0.5s ease;
          cursor: pointer;
      }
      
      selector img {
          width: 100%;
          height: auto;
          transition: transform 0.5s ease;
          transform: scale(1);
      }
      
      selector:hover img {
          transform: scale(1.1);
      }
      
      selector::before {
          content: '';
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background-color: rgba(0, 0, 0, 0.5);
          opacity: 0;
          transition: opacity 0.5s ease;
          z-index: 1;
          pointer-events: none;
      }
      
      selector:hover::before {
          opacity: 1;
      }
      
      selector::after {
          font-family: "Font Awesome 5 Free";
          content: "\f067";
          font-weight: 600;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          color: white;
          font-size: 20px;
          opacity: 0;
          transition: opacity 0.5s ease;
          z-index: 2;
          pointer-events: none;
      }
      
      /*第二个选择*/
      selector::after {
          content: "";
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
      
          width: 90px;
          height: 90px;
      
          background-image: url('https://ho.ddddseo.com/wp-content/uploads/2025/05/chevron-down.svg');
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
      
          opacity: 0;
          transition: opacity 0.5s ease;
          z-index: 2;
          pointer-events: none;
      }
      
      selector:hover::after {
          opacity: 1;
      }
      
  23. 如果一个模块超级长,你想创建一个滚动条,就可以用这个

    .tag-sidebar {
        max-height: 400px; /* 设置侧边栏的最大高度 */
        overflow-y: auto;  /* 启用垂直滚动条 */
        overflow-x: hidden; /* 隐藏水平滚动条,防止内容溢出 */
        padding-right: 10px; /* 为了让滚动条不挡住内容,可以增加一些内边距 */
    }
    
    /* 可选:美化滚动条样式 */
    .tag-sidebar::-webkit-scrollbar {
        width: 8px; /* 滚动条的宽度 */
    }
    
    .tag-sidebar::-webkit-scrollbar-thumb {
        background-color: #888; /* 滚动条颜色 */
        border-radius: 4px; /* 滚动条圆角 */
    }
    
    .tag-sidebar::-webkit-scrollbar-thumb:hover {
        background-color: #555; /* 悬停时滚动条颜色 */
    }
        1. 不是了,只是大家外贸建站的时候,会有各种细节和需求,帮忙处理一下,实现想法而已

  24. blurb拉进图标和文字的距离

    selector.et_pb_blurb_position_left .et_pb_blurb_container {
        padding-left: 1px;
    }
      1. selector {
            display: flex;
            align-items: center; /* 垂直居中 */
        }
        
        selector .et_pb_blurb_content {
            display: flex;
            align-items: center; /* 文字和图片都居中 */
        }
  25. 使用divi的图标库

    <span class="custom-expand-icon et-pb-icon">2</span> <!-- 使用Divi图标 -->
    .custom-expand-icon {
          font-family: 'ETmodules';
          color:#ff0000;
          font-size: 20px;
          cursor: pointer;
          transition: transform 0.3s;
        }
    
  26. 请问怎么把广告账户1的否定关键字列表添加到广告账户2里去呀?几千个词[失望R]而且添加了之后还要保持一样的否定匹配方式,有大神知道怎么操作吗?

  27. 在before的添加,底部添加横线 渐变

    content:"";
    display: inline-block;
        width: 100%;
        position: absolute;
        left: 0px; /* ARRANGE THIS */
        z-index: -1;
        width: calc(100% + 60px);
        background: linear-gradient(90deg,#72c5e2 0%,transparent 50%);
    
    bottom: 16px;
    height: 3px;
  28. 改变复制的选定文字样式

    /*改变复制的选定文字样式*/
    ::selection {
        color: #fff;
        background: #002fa7;
    }
  29. 打开的时候 有icon

    /*faq打开的时候 有icon*/
    .selector .et_pb_accordion_item.et_pb_toggle_open .et_pb_toggle_title:before {
    	display: block;
    	content: "\4d";
      margin-right:0px;
    }
    
  30. woocomerence 的产品相册自动播放

    add_filter( 'woocommerce_single_product_carousel_options', 'filter_single_product_carousel_options' );
    function filter_single_product_carousel_options( $options ) {
        $options['slideshow'] = true;  // 启用自动播放
        $options['animationLoop'] = true;  // 循环播放
        $options['slideshowSpeed'] = 3000;  // 设置切换间隔时间
        $options['pauseOnAction'] = false;  // 禁止手动操作时暂停
        $options['pauseOnHover'] = true;  // 鼠标悬停时暂停播放
        return $options;
    }
    
  31. 谷歌V3验证 消失

    .grecaptcha-badge {
        display: none;
    
    .grecaptcha-badge {
        display: none !important;
        
    }
    }
  32. Image Carousel 样式

    .lwp-slick-slider .slick-dots li button {
    
      border-radius: 3px;
        width: 23px;
        height: 5px;
      opacity: 1.0;
      background-color: #000000 !important;
    }
    
    .lwp-slick-slider .slick-dots li.slick-active button {
        background-color: #4f9cc4 !important;
    }
    
    .lwp_image_carousel_0 .big-slider .slick-slide img, .lwp_image_carousel_1 .big-slider .slick-slide img {
        border-radius: 0px 0px 0px 0px;
        overflow: hidden;
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
    }
  33. 表单跳转不同的页面

    add_action( 'wp_footer', 'wpm_redirect_cf7' );
    function wpm_redirect_cf7() { ?>
        <script type="text/javascript">
        document.addEventListener('wpcf7mailsent', function(event) {
    		
            if ('3255' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-1/';  }
    		
    		   else if ('504' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-2/';  } 
    		
    		   else if ('504' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-1-3/';  }
    		
    		  else if ('233029' == event.detail.contactFormId) {
                location = '/xiangdakai-pdf-4/';  }
    		  
    		  else {
                location = '/thank-you/';}   //默认的不选择的时候
    		
        }, false);
        </script>
    <?php }
    
  34. cloudways添加redis 启用

    开头

    define( 'WP_CACHE', true );

    wp-salt.php前面

    define(‘WP_CACHE_KEY_SALT’, ‘ddddseo.com’);
  35. tab的标题前面加图标

    .et-db #et-boc .et-l .et_pb_tabs_controls li a:before {
      font-family: 'ETmodules'; /* Divi图标字体 */
      display: inline-block; /* 使之表现得像内联块 */
      margin-right: 8px; /* 在图标和文本之间添加空间 */
      font-size: 15px; /* 调整图标大小 */
      vertical-align: middle; /* 垂直对齐 */
      color: #ff0000;
    }
    
    .et_pb_tab_0 a:before {
      content: '\5c'; /* 使用Divi图标Unicode */
    }
    
    .et_pb_tab_1 a:before {
      content: '\4c'; /* 使用Divi图标Unicode */
    }
    
    
    .et_pb_tab_2 a:before {
      content: '\45'; /* 使用Divi图标Unicode */
    }
  36. 增加WP的页面

    // 添加一个新的页面类型 例如产品页  文章页  等等带有分类和tag的页面类型
    function create_shoe_post_type() {
      register_post_type('shoe',
        array(
          'labels' => array(
            'name' => __('Shoes'),
            'singular_name' => __('Shoe')
          ),
          'public' => true,
          'has_archive' => true,
          'rewrite' => array('slug' => 'shoes'),
          'supports' => array('title', 'editor', 'thumbnail', 'excerpt', 'comments', 'custom-fields'),
        )
      );
    }
    add_action('init', 'create_shoe_post_type');
    
    
    
    
    function create_shoe_taxonomies() {
      // 添加分类法
      register_taxonomy(
        'shoe_category',
        'shoe',
        array(
          'labels' => array(
            'name' => __('Shoe Categories'),
            'singular_name' => __('Shoe Category'),
          ),
          'hierarchical' => true,
          'rewrite' => array('slug' => 'shoe-category'),
        )
      );
    }
    add_action('init', 'create_shoe_taxonomies');
    
    
    
    function create_shoe_tags() {
      // 添加标签
      register_taxonomy(
        'shoe_tag',
        'shoe',
        array(
          'labels' => array(
            'name' => __('Shoe Tags'),
            'singular_name' => __('Shoe Tag'),
          ),
          'hierarchical' => false,
          'rewrite' => array('slug' => 'shoe-tag'),
        )
      );
    }
    add_action('init', 'create_shoe_tags');
    
    1. acf增加的页面类型,然后添加类目和tag

      function create_taxonomies() {
        // 添加分类法
        register_taxonomy(
          'car_category',
          'car',
          array(
            'label' => __('Car Categories'),
            'rewrite' => array('slug' => 'car-category'),
            'hierarchical' => true,
          )
        );
      
        // 添加标签
        register_taxonomy(
          'car_tag',
          'car',
          array(
            'label' => __('Car Tags'),
            'rewrite' => array('slug' => 'car-tag'),
            'hierarchical' => false,
          )
        );
      }
      add_action('init', 'create_taxonomies');
      
    2. 页面全屏

      .container {
      width: 100%;
      max-width: 100%;
      }
      #left-area .post-meta {
      display: none;
      }
      .entry-title {
      display:none;
      }
      #main-content .container {
      padding-top: 0;
      }
      .container.et_menu_container {
      max-width: 80%;
      }
      
      body:not(.et-tb) #main-content .container, body:not(.et-tb-has-header) #main-content .container {
          padding-top: 0px;
      }
      
      @media (min-width: 981px) {
          #left-area {
              padding-bottom: 0px;
          }
      }
      
  37. 改变博客blog的列数量

    .four-column-blog-grid .et_pb_post {
    display:inline-block;
    vertical-align:top;
    width: 17.5% !important;
    margin-right:2% !important;
    margin-bottom:15px !important;
    background-color: #f2f2f2;
    }
  38. 让图片放大,而且限定在原来的位置

    transform: scale(1.2); /* 将图片放大至11% */
    transition: transform 0.9s ease; /* 添加平滑过渡效果 */
    overflow: hidden; /* 隐藏溢出的部分 */
    position: relative; /* 确保内部元素相对于容器定位 */
    1. 设置class: pa-vertical-align-blurb

      /* Media query for devices with a minimum width of 767 pixels */
      @media (min-width: 767px) {
          /* Flexbox display for blurb content */
          .pa-vertical-align-blurb .et_pb_blurb_content {
              display: flex!important;
          }
          
          /* Flexbox display for blurb container */
          .pa-vertical-align-blurb .et_pb_blurb_container {
              display: flex!important;
              justify-content: center; /* Center align blurb container horizontally */
              flex-direction: column; /* Arrange blurb container content in a column */
          }
          
          /* Flexbox display for main blurb image */
          .et-db #et-boc .et-l .pa-vertical-align-blurb .et_pb_main_blurb_image {
              display: flex;
              width: auto!important; /* Ensure blurb image width adjusts automatically */
              margin-bottom: 0px!important; /* Remove bottom margin for better alignment */
          }
      }
      
    2. 图标在右边

      Add this code to the “Blurb Image”

      margin-left: 12px;

      Add this code to the “Blurb Content”

      display: flex;
      flex-direction: row-reverse;
  39. 1.因不知关键词,未能更清楚一些模块的叫法和术语,想了解更多常用专业术语,举例子:mega menu,hero banner等等。

  40. 随机显示blog帖子, id:random-posts

    function dd_random_posts($query, $args) {
    	if (isset($args['module_id']) && $args['module_id'] === 'random-posts') {
    		$query->query_vars['orderby'] = 'rand';
    		$query->query_vars['order'] = 'ASC';
    		$query = new WP_Query( $query->query_vars );
    	}
    	return $query;
    }
    add_filter('et_builder_blog_query', 'dd_random_posts', 10, 2);
    
    1. <script>
      document.addEventListener("DOMContentLoaded", function() {
          // 选择特定类名下的所有链接
          var links = document.querySelectorAll('.aaaa a');
          // 遍历每个链接,设置其 target 属性为 "_blank"
          links.forEach(function(link) {
              link.target = "_blank";
          });
      });
      </script>
      
    1. 使用下面的代码

      /* 移除默认的列表样式,并添加自定义图标 */
      .selector ul { /* 指定ul,确保应用到正确的元素上 */
        list-style-type: none !important; /* 使用!important确保覆盖默认样式 */
        padding-left: 0 !important; /* 移除内边距 */
      }
      
      /* 单个 */
      .selector ul li{ 
        border-bottom: 0px solid #002fa7;
        margin-bottom: 10px;
      }
       
      .selector ul li::before { /* 目标是li元素的:before */
        content: '\45'; /* 使用Divi图标Unicode */
        font-family: 'ETmodules'; /* Divi图标字体 */
        display: inline-block; /* 使之表现得像内联块 */
        margin-right: 10px; /* 在图标和文本之间添加空间 */
        margin-top:-2px; /* 在图标和文本之间添加空间 */
        font-size: 18px; /* 调整图标大小 */
        vertical-align: middle; /* 垂直对齐 */
        color:#ff0000;
      }
      
  41. 受隐私保护政策影响,自2024年3月起,对于在欧洲地区投放广告的企业和个人,Google将强制要求其推广的所有网站和应用须使用Consent Mode意见征求模式弹窗,以便在同意状态下收集用户数据。目前账户投放的有欧洲市场,需要在3月份之前加一下,不然跟踪不到客户轨迹
    解决方法:
    https://www.termsfeed.com/cookie-consent/

    使用国外的这个平台提供的方法
    JS 代码加在自己的网站上,记的改自己的GA ID, 按钮背景和文字的颜色css也可以改一下

    <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){
    	dataLayer.push(arguments);
    }
    gtag('consent', 'default', {
    	'ad_storage': 'denied',
    	'ad_user_data': 'denied',
    	'ad_personalization': 'denied',
    	'analytics_storage': 'denied'
    });
    </script>
    
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXX改成自己的GA ID"></script>
    <script>
    	window.dataLayer = window.dataLayer || [];
    	function gtag(){dataLayer.push(arguments);}
    
    	gtag('js', new Date());
    	gtag('config', 'G-XXX改成自己的GA ID');
    </script>
    
    <script type="text/javascript" src="//www.termsfeed.com/public/cookie-consent/4.1.0/cookie-consent.js" charset="UTF-8"></script>
    <script type="text/javascript" charset="UTF-8">
    document.addEventListener('DOMContentLoaded', function () {
    cookieconsent.run({"notice_banner_type":"simple","consent_type":"express","palette":"light","language":"en","page_load_consent_levels":["strictly-necessary"],"notice_banner_reject_button_hide":false,"preferences_center_close_button_hide":false,"page_refresh_confirmation_buttons":false,
                       
      "callbacks": {
    	"scripts_specific_loaded": (level) => {
    		switch(level) {
    			case 'targeting':
    				gtag('consent', 'update', {
    					'ad_storage': 'granted',
    					'ad_user_data': 'granted',
    					'ad_personalization': 'granted',
    					'analytics_storage': 'granted'
    				});
    				break;
    		}
    	}
    },
    "callbacks_force": true
                      });
    });
    </script>
    

    css代码修改,样式

    /*同意按钮*/
    .termsfeed-com---palette-light .cc-nb-okagree {
        color: #fff !important;
        background-color: #025ffd !important;
    }
    
    /*拒绝按钮*/
    .termsfeed-com---palette-light .cc-nb-reject {
        color: #333333 !important;
        background-color: #eaeaea !important;
    }
     
    /*窗口*/
    .termsfeed-com---palette-light.termsfeed-com---nb {
        background-color: #ffffff !important;
        color: #111;
      border-radius: 5px 5px 5px 5px;
      border: 1px solid #ff0000;
      box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3); /* 元素的阴影效果 */
    }
     
    /*调整尺寸*/
    .termsfeed-com---nb-simple {
        right: 3%!important;
        top: auto;
        bottom: 5px !important;
        left: 3% !important;
        max-width: 100% !important;
        position: fixed;
    }
     
    /*方位*/
    .termsfeed-com---nb {
        overflow: auto;
        z-index: 99999999999;
        font-size: 16px;
    }
     
    /*内部距离*/
    .termsfeed-com---nb .cc-nb-main-container {
     padding: 10px 30px 10px 30px  !important;
      
    }
     
    /*控制标题*/
    .termsfeed-com---nb .cc-nb-title {
        font-size: 20px !important;
        font-weight: 600;
       /* display: none; 设备注:不想显示标题 就生效这个 */
    }
    .termsfeed-com---reset p {
        margin-top: 0;
        margin-bottom: 5px !important;
    }
     
    /*控制内容*/
    .termsfeed-com---nb .cc-nb-text {
        font-size: 13px !important;
        margin: 0 0 10px 0 !important;
    }
    
    
  42. 如果想改变一些系统wordpress 默认的文案,可以用这个JS

    document.addEventListener('DOMContentLoaded', function() {
        var allTabs = document.querySelectorAll('a.more-link'); // 选择器
    
        allTabs.forEach(function(tab) {
            if (tab.textContent === '了解更多') {
                tab.textContent = 'Your New Text'; // 更改为你想要的文本
            }
        });
    });
    
  43. 想在独立站做一个倒计时的显示区域,需要实时显示秒数的那种

    1. <div id="countdown">
        <span id="days">00</span>天
        <span id="hours">00</span>小时
        <span id="minutes">00</span>分钟
        <span id="seconds">00</span>秒
      </div>
      
      <script>
        function calculateCountdown(endDate) {
          var now = new Date();
          var timeSpan = endDate - now;
      
          if (timeSpan > 0) {
            var days = Math.floor(timeSpan / (1000 * 60 * 60 * 24));
            var hours = Math.floor((timeSpan % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((timeSpan % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((timeSpan % (1000 * 60)) / 1000);
            return { days, hours, minutes, seconds, timeSpan };
          } else {
            return { days: 0, hours: 0, minutes: 0, seconds: 0, timeSpan: 0 };
          }
        }
      
        // 设置结束日期和时间,这里使用的是UTC时间
        var endDate = new Date(Date.UTC(2025, 0, 1, 0, 0, 0));
      
        function updateCountdown() {
          var countdown = calculateCountdown(endDate);
      
          if (countdown.timeSpan <= 0) {
            clearInterval(intervalId); // 停止倒计时
            // 可以添加倒计时结束时的处理逻辑
          }
      
          document.getElementById('days').textContent = countdown.days.toString().padStart(2, '0');
          document.getElementById('hours').textContent = countdown.hours.toString().padStart(2, '0');
          document.getElementById('minutes').textContent = countdown.minutes.toString().padStart(2, '0');
          document.getElementById('seconds').textContent = countdown.seconds.toString().padStart(2, '0');
        }
      
        var intervalId = setInterval(updateCountdown, 1000); // 每秒更新一次倒计时
        updateCountdown(); // 页面加载时立即更新倒计时
      </script>
      
      
    2. <div id="timer">
        <span id="days">00</span>天
        <span id="hours">00</span>小时
        <span id="minutes">00</span>分钟
        <span id="seconds">00</span>秒
      </div>
      
      <script>
        function calculateTimeSince(startDate) {
          var now = new Date();
          var timeSpan = now - startDate;
      
          var days = Math.floor(timeSpan / (1000 * 60 * 60 * 24));
          var hours = Math.floor((timeSpan % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
          var minutes = Math.floor((timeSpan % (1000 * 60 * 60)) / (1000 * 60));
          var seconds = Math.floor((timeSpan % (1000 * 60)) / 1000);
      
          return { days, hours, minutes, seconds };
        }
      
        // 请注意月份是从0开始的,0代表1月,1代表2月,以此类推
        // 例如,下面的时间代表2024年1月1日0时0分0秒
        var startDate = new Date(Date.UTC(2024, 0, 1, 0, 0, 0));
      
        function updateTimer() {
          var time = calculateTimeSince(startDate);
      
          document.getElementById('days').textContent = time.days.toString().padStart(2, '0');
          document.getElementById('hours').textContent = time.hours.toString().padStart(2, '0');
          document.getElementById('minutes').textContent = time.minutes.toString().padStart(2, '0');
          document.getElementById('seconds').textContent = time.seconds.toString().padStart(2, '0');
        }
      
        setInterval(updateTimer, 1000); // 每秒更新一次时间
        updateTimer(); // 页面加载时立即更新时间
      </script>
      
  44. 我用独立站iframe 例如地图或者视频的时候,那个比例始终调不对,宽度100% 高度500px 不同的设备 效果不一样,请问可以解决吗

    1. 用这个

      <div class="video-container">
        <iframe src="your-video-url" frameborder="0" allowfullscreen></iframe>
      </div>
      
      .video-container {
        position: relative;
        width: 100%;
        padding-bottom: 75%; /* 高度是宽度的75% */
        height: 0;
      }
      
      .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
      
  45. 独立站中给一段文字,做样式常用的几个

    .dddd-text {
        margin: 30px 0px 0px 0px;
        padding: 1px 10px 1px 10px;
        background-color: #d1d1d100;
        text-align: left;
        color: #333333;
        font-size: 20px;
        line-height: 1.8em;
        border: 1px solid #dddddd;
        border-radius: 0px 0px 0px 0px;
        box-shadow: 0px 0px 0px 0px #f40707;
        transform: scale(1.00,1.00);
    }
    
  46. 产品页面添加作者

    unction add_author_support_to_products() {
       add_post_type_support( 'product', 'author' ); 
    }
    add_action( 'init', 'add_author_support_to_products' );
    
  47. blog图片缩略图用800×420
    为了在高分辨率设备上呈现出完美效果,建议使用尺寸至少为 1200 x 630 像素的图片。您应该使用尺寸至少为 600 x 315 像素的图片,以展示附有更大图片的链接式公共主页帖子。

  48. 产品缩略图自定义数量

    .woocommerce div.product div.images .flex-control-thumbs li {
        width: 15%;
        margin-right: 2%;
        margin-bottom: 2%;
    }
    
    .woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) {
        clear: left;
        clear: none;
    }
    
    .woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(6n+1) {
        clear: left;
    
    }
    
    .woocommerce div.product div.images .flex-control-thumbs li:nth-of-type(4n) {
        margin-right: 2%;
    }
    
    .woocommerce div.product div.images .flex-control-thumbs li:nth-of-type(6n) {
        margin-right: 0;
    }
    
    
    .woocommerce div.product div.images .flex-control-thumbs li img.flex-active, .woocommerce div.product div.images .flex-control-thumbs li img:hover {
        border-width: 1px;
      border-color: #ff0000;
    }
    
    1. pip install pandas
      pip install openpyxl
      pip install xlrd
      pip install xlwt

      pip install pandas openpyxl xlrd

      处理excel表格的

  49. blog页面如果想解释图片的详细

    <div class="blog_image">
    <img class="wp-image-10552 alignnone size-full" src="https://unblast.com/wp-content/uploads/2023/11/Tear-off-Envelope-Mockup-1536x1024.jpg" alt="xxxxxxx" width="720" height="540" />
    图片描述的<cite>©<a href="https://unblast.com/tear-off-envelope-mockup/" rel="nofollow ugc">写引用的图片地址</a></cite>
    </div>
    
    .blog_image{
      text-align: center;
      line-height: 1.2em;
      margin-bottom: 4%;
      font-size: 15px;
    }
    
  50. 实现普通的图片,鼠标经过的时候,显示自己的文字,图片要打开点击图片功能

    .pa-image-hover-text .et_overlay.et_pb_inline_icon:before {
    	content: "iam text show";
    	font-family: inherit !important;
    	font-size: 24px;
    	line-height: 1.3em;
    	text-align: center;
    	transform: translateX(-50%) translateY(-50%);
    	margin-left: 0px;
    	width: 80%;
    }
  51. 按钮并列

    .ddddbutton
    .et_pb_button_module_wrapper {
    display: inline-block;
    }
    
      .ddddbutton
    .et_pb_image  {
    display: inline-block;
    }
    
  52. 左右排列结构,图文左右交错的时候,在手机上要变成图片在上的解决

    中框加

    display: flex;
    flex-wrap: wrap;
    

    列的顺序分别加用
    order: 1;
    order: 2;
    order: 3;
    进行手动排序

    1. width: 48% !important;
      float: left !important;
      margin-right: 2% !important;
      

      手机 2列 放在所在的列

  53. Davis你好,感觉b2b企业很难做seo啊,产品单一,页面少,有没有b2b做的还不错的网站可以参考的吗
    然后还有一个就是,如果把title设计成h1标签,是不是浪费了这个标签的重要性?关于h1标签可以给讲一下吗,谢谢

    1. 做的好的b2b 网站太多了,加我微信 可以给你一些
      关于title 和 H1 其实是2个东西,一个是页面放在谷歌搜索结果的叫做title, H1其实是页面内容的最大标题

  54. 手动做一个按钮

    <a href="#" target="_blank" rel="noopener" class="button_blog">联系我获取报价</a>
    /*作者的按钮*/
    .button_blog {
        display: inline-block;
        padding: 10px 20px;
        font-size: 16px;
        color: #ffffff !important; 
        background-color: #002fa7;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        text-decoration: none;
    }
    .button_blog:hover {
        background-color: #333333;
    	transform: scale(1.03, 1.03);
    }
  55. 侧边栏菜单 折叠样式设计

    .menu-product_page-container .sub-menu {
        display: none;
    }
    .menu-product_page-container li.menu-item-has-children:hover > .sub-menu {
        display: block;
    }
    .menu-product_page-container li.menu-item-has-children:before{
       font-family: ETmodules;
       content: "\43";
       position: absolute;
       right: 5px;
    }
  56. woocommerce_items_in_cart
    火箭缓存有的时候,更新采购车数量不及时,可以用这个放在不缓存的cookie

  57. 让按钮或者文字动起来

    animation-name: left;
        animation-duration: 3s;
        animation-iteration-count: infinite;
        animation-timing-function: ease-in-out;
        margin-left: 0px;
        margin-top: 0px;
    }
    
    @keyframes left {
        from { transform: translate(0, 0px); }
        50%  { transform: translate(-15px, 0px); }
        to   { transform: translate(0, 0px); }
    
    1. animation: bouncing 1.0s cubic-bezier(0.1, 0.05, 0.05, 10) 0s infinite alternate both;

      另外一个也能实现

  58. 隐藏后台地址

    add_action('login_enqueue_scripts', 'tb_wp_login_protection');
    function tb_wp_login_protection(){
        if( !isset($_GET['ddddseo']) ){
            header('Location: https://www.google.com');
            exit;
        }
    }

    域名/wp-login.php?ddddseo, 改成这个了, 输错就到谷歌

  59. 设置一个区域,鼠标放上产生变化

    .left-pro ul li:before {
        border-top: 2px solid #29b6f6;
        border-bottom: 2px solid #29b6f6;
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform: scale(0,1);
        -webkit-transform: scale(0,1);
    }
    .left-pro ul li:before, .left-pro ul li:after {
        content: '';
        display: block;
        position: absolute;
        top: -2px;
        left: 2px;
        right: -2px;
        bottom: -2px;
        transition: all .5s;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        opacity: 0;
    }
  60. 用于主推的一些场景

    产品菜单Updated

    产品菜单Hot

    产品菜单<sup><span style="color: #ffffff;font-size: 5px;line-height: 1.4em!important;background-color: #ff0000;">Hot</span></sup>
  61. Woocommerce的结算单定制

    /**
     * Edit Billing Details to Remove Fields You Dont Want 
     **/
    function njengah_remove_checkout_fields( $fields ) {
    
        // Billing fields
        // 账单的显示
        
        unset( $fields['billing']['billing_company'] );
        // unset( $fields['billing']['billing_phone'] );
        unset( $fields['billing']['billing_state'] );
        // unset( $fields['billing']['billing_first_name'] );
        unset( $fields['billing']['billing_last_name'] );
        unset( $fields['billing']['billing_address_1'] );
        unset( $fields['billing']['billing_address_2'] );
        unset( $fields['billing']['billing_city'] );
        unset( $fields['billing']['billing_postcode'] );
    	
    	
    	// 修改显示的那个文字
    	$fields['billing']['billing_last_name']['label'] = '微信号';
    	$fields['billing']['billing_first_name']['label'] = '姓名';
    	//$fields['billing']['billing_city']['label'] = '姓名2342';
    	
    	
    	
    	
    	
    	// Shipping fields
    		unset( $fields['shipping']['shipping_company'] );
    		// unset( $fields['shipping']['shipping_phone'] );
    		unset( $fields['shipping']['shipping_state'] );
    		// unset( $fields['shipping']['shipping_first_name'] );
    		unset( $fields['shipping']['shipping_last_name'] );
    		unset( $fields['shipping']['shipping_address_1'] );
    		unset( $fields['shipping']['shipping_address_2'] );
    		unset( $fields['shipping']['shipping_city'] );
    		unset( $fields['shipping']['shipping_postcode'] );
    
                    // Order fields
                    // unset( $fields['order']['order_comments'] );
    	
    	return $fields;
    	
    } 
    	add_filter( 'woocommerce_checkout_fields', 'njengah_remove_checkout_fields' ); 
    
    add_filter( 'woocommerce_checkout_fields', 'bbloomer_required_woo_checkout_fields' );
    
    
    //  必选项
    function bbloomer_required_woo_checkout_fields( $fields ) {
    	
    	
        $fields['billing']['billing_first_name']['required'] = false;	
    	 //$fields['billing']['billing_email']['required']   = false;
    	//$fields['billing']['billing_city']['required']      = false;
    	//$fields['billing']['billing_postcode']['required']  = false;
    	//$fields['billing']['billing_country']['required']   = false;
    	//$fields['billing']['billing_state']['required']     = false;
    	//$fields['billing']['billing_address_1']['required'] = false;
    	//$fields['billing']['billing_address_2']['required'] = false;
    	
    	
    	
        return $fields;
    }
    
    
    
    /**
    * Billing Checkout Fields
    */
          //billing_first_name
          //billing_last_name
          //billing_company
          //billing_address_1
          //billing_address_2
          //billing_city
          //billing_postcode
          //billing_country
          //billing_state
          //billing_email
          //billing_phone
     
    /**
    * Shipping Checkout Fields
    */
          //shipping_first_name
          //shipping_last_name
          //shipping_company
          //shipping_address_1
          //shipping_address_2
          //shipping_city
          //shipping_postcode
          //shipping_country
          //shipping_state
     
    /**
    * Account Checkout Fields
    */
          //account_username
          //account_password
          //account_password-2
     
    /**
    * Order Checkout Fields
    */
          //order_comments
    
    
  62. width: 10%!important;

    I started with 4 columns set to 1/4 each.
    In the row sizing, I set the row with and max-width to 100%.
    While I was there I changed the gutter to 1.
    In the first column with the logo, I set the width to 10%.
    The second column with the menu is larger, so I set the width to 65%.
    In the third column with the button, I set the width to 10%.
    Lastly, in the fourth column with the social follow, I set the width to 15%.

    如何设置列的自定义宽度
    https://www.peeayecreative.com/how-to-resize-divi-column-widths/

  63. tag的数量限制突破,解决方案

    function set_widget_tag_cloud_args($args) {
        $my_args = array(
            'orderby'  => 'count',
            'order'    => 'DESC',
            'number'   => 500
            );
        $args = wp_parse_args( $args, $my_args );
        return $args;
    }
    add_filter('widget_tag_cloud_args','set_widget_tag_cloud_args');
    add_filter('woocommerce_product_tag_cloud_widget_args','set_widget_tag_cloud_args');
  64. 竖着

    横着

  65. 6列产品生效

    .woocommerce-page.columns-6 ul.products li.product, .woocommerce.columns-6 ul.products li.product 
    { 
    width: 15%!important; 
    margin: 0 2% 2.992em 0 !important; 
    } 
    .woocommerce.columns-6 ul.products li.product.last {
    margin-right: 0 !important;
    } 
    .et_right_sidebar.woocommerce-page #main-content .woocommerce-page.columns-6 ul.products li.product:nth-child(3n+1), .et_right_sidebar.woocommerce-page #main-content .woocommerce.columns-6 ul.products li.product:nth-child(3n+1)  { clear:none !important; 
    }
    .et_full_width_page.woocommerce-page ul.products li.product:nth-child(4n+1), .et_left_sidebar.woocommerce-page #main-content ul.products li.product:nth-child(3n+1), .et_right_sidebar.woocommerce-page #main-content ul.products li.product:nth-child(3n+1) {
        clear: none;
    }
    

    5列产品生效

    .woocommerce-page.columns-5 ul.products li.product, .woocommerce.columns-5 ul.products li.product { width: 16.95%!important; margin: 0 3.8% 2.992em 0 !important; } .woocommerce.columns-5 ul.products li.product.last { margin-right: 0 !important; } .et_right_sidebar.woocommerce-page #main-content .woocommerce-page.columns-5 ul.products li.product:nth-child(3n+1), .et_right_sidebar.woocommerce-page #main-content .woocommerce.columns-5 ul.products li.product:nth-child(3n+1)  { clear:none !important; }
    
  66. 改变评论区的文字

    <script>
    jQuery(document).ready(function(){
    jQuery(".ddddseoco #et_pb_submit").html('CUSTOM SUBMIT BUTTON TEXT GOES HERE');
    jQuery(".ddddseoco #reply-title span").html('CUSTOM TITLE TEXT GOES HERE');
    });
    </script>
  67. Davis你好,对于外链的选择有什么推荐吗,在fiverr上也不知道怎么挑,感觉不知道从何下手。

    1. 首先做外链先确保一个事情,就是内容要做的很好情况下再考虑外链。Fiverr上普遍都是那种垃圾的外链,现在谷歌对于垃圾的外链很打击。 现在做外链的原则是质量大于数量,我自己的外链大部分都是我的网站内容的图片好看,被别人拿去做借用,给我的外链,都是行业高度相关的。 有条件的话,去好的外链的平台找吧,别在Fiverr上找,价格高的普遍质量还行

  68. 图标靠左的代码,用于FAQ板块

    /*move the toggle icon to the left*/
    
    .pa-toggle-icon-left .et_pb_toggle_title:before {
    	left: 0 !important;
    }
    /*adjust spacing on the left for the icon*/
    
    .pa-toggle-icon-left .et_pb_toggle_title,
    .pa-toggle-icon-left .et_pb_toggle_content {
    	padding-left: 2em !important
    }
    
    /*move the accordion icon to the left*/
    
    .pa-accordion-icon-left .et_pb_toggle_title:before {
    	left: 0 !important;
    }
    
    
    /*adjust spacing on the left for the icon*/
    
    .pa-accordion-icon-left .et_pb_toggle_title,
    .pa-accordion-icon-left .et_pb_toggle_content {
    	padding-left: 2em !important
    }
  69. 第一次新建post,我才写了文章的标题,页面自动跳转显示(编辑器遇到意外错误),这个怎么解决呢?

    1. 编辑器插件可以先暂定,然后看看正常不。 如果可以了,那就编辑器插件的问题,是正版的吗?

  70. 图片列表不要自动裁剪

    function wpc_remove_height_cropping($height) {
    	return '9999';
    }
    function wpc_remove_width_cropping($width) {
    	return '9999';
    }
    
    add_filter( 'et_pb_gallery_image_height', 'wpc_remove_height_cropping' );
    add_filter( 'et_pb_gallery_image_width', 'wpc_remove_width_cropping' );
    
    1. Projects的缩略图尺寸修改

      add_filter( 'et_pb_portfolio_image_height', 'portfolio_size_h' );
      add_filter( 'et_pb_portfolio_image_width', 'portfolio_size_w' );
      
      function portfolio_size_h($height) {
      	return '300';
      }
       
      function portfolio_size_w($width) {
      	return '300';
      }
    2. gallery的列数

      @media only screen and ( min-width: 768px ) {
      
      .three-column-grid .et_pb_grid_item {
      width: 28.333% !important;
      margin: 0 7.5% 7.5% 0 !important;
      }
       
      .three-column-grid .et_pb_grid_item:nth-child(3n) {
      margin-right: 0 !important;
      }
      
      .three-column-grid .et_pb_grid_item:nth-child(3n+1) {
      clear: left;
      }
      
      .three-column-grid .et_pb_grid_item:nth-child(4n+1) {
      clear: unset !important;
      }
      
      }
  71. 搜索结果中要包含product和project

    function custom_remove_default_et_pb_custom_search() {
    	remove_action( 'pre_get_posts', 'et_pb_custom_search' );
    	add_action( 'pre_get_posts', 'custom_et_pb_custom_search' );
    }
    add_action( 'wp_loaded', 'custom_remove_default_et_pb_custom_search' );
    
    function custom_et_pb_custom_search( $query = false ) {
    	if ( is_admin() || ! is_a( $query, 'WP_Query' ) || ! $query->is_search ) {
    		return;
    	}
    
    	if ( isset( $_GET['et_pb_searchform_submit'] ) ) {
    		$postTypes = array();
            
    		if ( ! isset($_GET['et_pb_include_posts'] ) && ! isset( $_GET['et_pb_include_pages'] ) ) {
                $postTypes = array( 'post' );
            }
    
    		if ( isset( $_GET['et_pb_include_pages'] ) ) {
                $postTypes = array( 'page' );
            }
    
    		if ( isset( $_GET['et_pb_include_posts'] ) ) {
                $postTypes[] = 'post';
            } 
    
    		/* BEGIN Add custom post types */
    		$postTypes[] = 'product';
                  $postTypes[] = 'project';
    		/* END Add custom post types */
    
    		$query->set( 'post_type', $postTypes );
    
    		if ( ! empty( $_GET['et_pb_search_cat'] ) ) {
    			$categories_array = explode( ',', $_GET['et_pb_search_cat'] );
    			$query->set( 'category__not_in', $categories_array );
    		}
    
    		if ( isset( $_GET['et-posts-count'] ) ) {
    			$query->set( 'posts_per_page', (int) $_GET['et-posts-count'] );
    		}
    	}
    }
    
  72. 让中列垂直居中的方法,分列的css加, 对齐

    margin: auto;

    中框加

    多个居中对齐,在最大的中框加这个

    align-items: center;

    底部对齐

    align-items: flex-end;
    1. 第二种对齐居中方法, 占满

      display: flex;
      flex-direction: column;
      justify-content: center;
      
    2. 所属的列加这个,无限叠加和对齐

      display: flex;
      align-items: center; /* (flex-start | flex-end | center | baseline | stretch) */
      justify-content: center;
      
    3. 第三种方法,罗列叠加

      所属的列加

      display: flex;
          flex-wrap: wrap; /* 允许子项换行 */
          /*align-items: center;*/
          /*justify-content: center;*/

      黑色元素加

       flex: 0 0 20%; /* 不允许项目增长或缩小,并设置基础大小为容器宽度的20% */
          /* 如果容器宽度允许,这将确保每行容纳5个项目 */
          /* 您也可以设置为flex-basis: 20%; 如果您不想使用flex缩写属性 */
        
  73. 如果想定义某一个区域内的所有链接都要新窗口打开,就定义class,“ddddseo-newtab”.
    然后加js代码

    <script>
    jQuery(document).ready(function(){
        jQuery(".ddddseo-newtab a").each(function(){
            jQuery(this).attr("target", "_BLANK");     
        })
    })
    </script>
  74. 我们做网站的时候,放youtube视频,视频结束后,会推荐其他同行的视频,相信这个是很多人的痛点。 我找一个方法 亲测 很有用,视频结束后只会推荐自己的频道视频,好用的很。
    给油管的视频元素加class, 叫做 “yincang-ddddseo-videos”

    然后加JS代码

    <script>
    jQuery(document).ready(function($ ) {
    $('.yincang-ddddseo-videos iframe').attr( "src", function( i, val ) {
    return val + '&rel=0';
    });
    });
    </script>
    1. <script>
      jQuery(document).ready(function($ ) {
      $('.et_pb_video iframe').attr( "src", function( i, val ) {
      return val + '&rel=0';
      });
      });
      </script>
      
    1. manufacturer
      factory
      supplier
      wholesale
      distributor
      china
      seller
      maker
      company
      dealer
      europe
      vendor
      purchase
      import
      export
      hs code

      我这边有一些可以参考

  75. 你好,如果我想wordpress的网站显示语言是中文,后台的编辑是英文,怎么设置呀?

    1. 这种情况下,有一个方式就是,在wordpress后台的Users上找到自己的个人资料,把个人资料的语言设置成英语,就可以实现你的这个想法

      1. 站点语音设置成中文的 用户语音设置成英文的就可以实现这个效果了吗?

    1. 其实只要把页面的wordpress的默认评论功能给它打开,然后在页面中布局上这个评论元素,就成为了具有论坛功能的页面,大家自由讨论和回复。
      就像我的这个讨论页面一样,另外如果用论坛功能的话,其实可以使用二级域名新开一个网站,用Discuz来建这个网站,就是完整的论坛功能。

  76. 网站的收录特别慢,post和page发布后,要等很久才能收录,咋回事

    1. 你可以使用Google Search Console 网站检查功能,当输入网址后,如果提示没有被收录,你可以点击“请求编入索引”这个按钮,正常你的网站没有被惩罚的情况下,这个手动收录还是蛮有用的,我的一些外贸站,有的时候5分钟就被收录了

  77. 你好,请问有没有好用的备份网站的插件,最好是能备份到本地电脑的

    1. 我推荐用Duplicator插件

      1. 备份简单,只需要简单的设置就可以完成本地的网站备份,可以设置密码,大家备份的大小很大的话,有时会备份不成功,告诉大家一个小技巧,upload这个网站文件夹可以不做备份,剔除后备份文件就变小了。

      2. 恢复很简单,只需要根据一个恢复php文件,就可以一直下一步来恢复网站

      3. 那个upload文件夹可以在网站恢复好,然后把upload的文件直接覆盖掉就行了。

  78. Daivs, 你好,我也是用了divi主题,我看到别人的菜单有一个效果,我也想实现,就是一级菜单能展开成3列或4列,全屏显示的,我在主题设置里面没找到,请问你知道怎么做吗?

      1. 那个我做完正常下拉怎么都是粗体字还有颜色是不是可以单独改浅一点

        1. 可以F12 找到css的id,然后修改color 还有字体的css参数设置,例如: font-weight: 500; 这种

  79. youtube的底层流量推荐逻辑是什么?新手做YouTube应该注意什么?

    1. 底层逻辑就是你的视频内容是有用的,有价值的,能看的下去的。 youtube后台有一个数据就是每个用户看视频的百分比,例如优秀的视频很多人都能给看90%,没有略过快进之类的, 假设你的是视频大部分用户都看了10%以下,基本看不完就走了,那么谷歌就认为你这个是垃圾的内容,基本是不会给推荐和排名的,所以优质的内容是前提。
      新手做的话:别触碰谷歌的规则,不能抄袭别人的是视频,背景或者片段音乐都有版权的,这个要注意,给个小建议给你,youtube有一个免费的音乐库,用那个里面的音乐。 另外视频全部原创自己拍,自己剪辑,剪辑软件可以用Pr,我用的就是这个,希望能帮助到你

  80. 想搭建一个综合所有同行的服务&价格&物流等对比信息的网站,方便用户筛选,有可以借鉴的比较成熟的网站吗

    1. 这个我建议哈:直接谷歌搜索你的这个服务类型的关键词,查看第一页的搜索结果大家做的网站是什么样的,基本上第一页符合谷歌对于你的搜索意图的分析得出的结论,可以直接借鉴首页的网站,如果大家都是文章页,你就要布局文章页,如果是其他的类型的内容,我们可以直接借鉴来做。

  81. 你好,我有一个问题很棘手,客户的留言表单一直发送不成功,很急。。。

    但是,如果我登录了我的后台,去测试询盘留言表单的发送功能,每次都测试都成功,这怎么解决呀,站长

  82. 你好,Davis。我去年签约了一家服务商,按照约定,他们做了100个关键词到首页,可是这些词都不合理(因为我们不能指定关键词)。现在一年了,也没收到有效的询盘,偶尔收到的也都是垃圾询盘,推销类的。这种情况怎么办呢?如果直接不要这个网站了,又感觉可惜,花了很多钱呢。。。

    1. 你好,这个事情的缘由呢,我在网站的首页有分析这个为啥什么没有询盘,你可以去看一下,网址是:https://ddddseo.com/ ,这种情况,我建议你看能不能要回一些款回来, 另外这个网站其实是废了,不要感觉到可惜。
      不如你自己从新建立一个完全属于自己的网站,赶紧吧,时间不等人,走正确的路,有啥疑问可以私我

    1. 1. 域名其实在哪里注册都差不多,但是要选择大公司的,我们走外贸的话,我挺建议用国外的注册商的,不要备案,随时可注册,还保护隐私,我首推荐namesilo,每年现在9.8美金每年一年,包含隐私保护,还是国际知名的注册商,不怕跑路,PS: 我个人注册了十几个域名了,有点上瘾,别学我,捂脸。。

      2. 服务器的话,我买过siteground, hostinger, 和cloudways, 都是比较知名的几个。 我最后选择了cloudways, 因为速度相对快,相当于优化后的VPS,有独立ip,外贸人用14.5美金一个月的就行,我放了3个网站,都挺流畅的。

  83. Davis,你好。有没有好用的视频编辑软件分享一下呀,我的诉求是剪辑,配字幕,最好还要配音,需要怎么做呢?非常感谢!

    1. 视频剪辑的话,我推荐用Adobe家的Pr软件,这个是专业的视频剪辑,简单上手,属于非常专业级别的。 我们做外贸的只要会操作基本的就行了例如: 剪辑,加文字,加音乐,我认为就可以了,做外贸的视频足够的。 友情提醒一下: youtube更喜欢4K格式的视频哦,未来的考虑,所以请拍一些高清的素材来做,保证效果很好,独家经验,有不明白或者操作细节可以私下找我详细了解

    1. 这个问题其实回答起来,挺简单的,我们就用人数用的最多的那些,因为啥呢,使用过程中遇到疑问能很容易,找到同样问题的前辈解答信息,不推荐用小众的。
      目前主流的有Astra, DIVI, Avada 等等, 站长经常使用和本网站使用的都是DIVI

  84. 我是第一条评论,大家有问题可以直接提问,我会公开回答大家的问题

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

添加微信沟通细节