如何创建有效的 Wordpress 子主题答案

【问题标题】：how to create working Wordpress child theme如何创建有效的 Wordpress 子主题
【发布时间】：2017-01-21 11:19:17
【问题描述】：

我创建了一个子主题，但随后我想在主菜单中添加一些不会改变的样式。

我在方向创建了一个文件夹aloshop-child

\public_html\wp-content\themes

在这个文件夹中，我创建了两个文件 style.css 和 function.php 在function.php中我添加了代码：

<?php

function aloshop_child_enqueue_styles() {

$parent_style = 'aloshop';

wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'aloshop',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style )
);
}
add_action( 'wp_enqueue_scripts', 'aloshop_child_enqueue_styles' );

在 style.css 中添加简单的信息

/*
Theme Name: Aloshop child theme
Author: Mantas Slau
Description: A child theme of the Aloshop default WordPress theme
Version: 1.1
Template:     aloshop
*/

接下来我做了什么，在仪表板中激活了这个子主题。

所以我尝试检查这个子主题是否有效。我从我的视觉作曲家自定义 css 代码（我是临时添加的，然后我开发了我的页面）中剪切并将其粘贴到子主题中 --> `style.css。

 /*
    Theme Name: Aloshop child theme
    Author: Mantas Slau
    Description: A child theme of the Aloshop default WordPress theme
    Version: 1.1
    Template:     aloshop
    */

    .footer-box  h2 {
        font-size: 14px;
        font-weight: 700;
        margin: 0 0 13px;
        text-transform: uppercase;
        color: #fe9c00;
    }
    .menu-footer a {
        border-left: 1px solid #dadada;
        display: block;
        height: 14px;
        line-height: 14px;
        padding: 0 13px;
        color: white;
    }
    .footer-box  p {
       color: white;
    }
    .footer-menu-box-end a {
        color: white;
        font-size: 14px;
        padding-left: 10px;
        position: relative;
    }
    .footer-menu-box-end a:hover{
        color: #fe9c00;
    }
    .footer-menu-box-end  h2 {
        font-size: 14px;
        font-weight: 700;
        margin: 0 0 13px;
        text-transform: uppercase;
        color: #fe9c00;
    }
    .footer-box-contact  a {
       color: white;
    }
    .social-footer li:first-child a{
        margin-left:10;
    }
    .social-footer.social-network label {
        margin: 0 0 10px;
        color: #fe9c00;
    }
    .category-home-label span {
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        margin: 0;
        text-transform: uppercase;
        vertical-align: middle;
    }
    ul {
        padding: 0;
        list-style: none;
    }
    .sub-menu-top {
        width: 200px;
    }
    .list-child-category {
        min-height: 155px;
    }
    .woocommerce div.product .product_title {
      font-size: 25px;
        font-weight: 700;
        margin: 0 0 13px;
        text-transform: uppercase;
    }
    .price span {
      font-size: 25px;
        font-weight: 700;
        margin: 0 0 13px;
        text-transform: uppercase;
      color: #fe9c00;
    }
    .woocommerce div.product div.images img {
        /* display: block; */
        /* width: 100%; */
        /* height: auto; */
        /* box-shadow: none; */
        width: 350px;
        padding: 1px;
        border: 1px solid #e0e0d1;
        background-color: #e0e0d1;
    }

样式代码，但没有意义。

保存 ---> 刷新和样式不起作用。有人可以帮助解决这个问题吗？我做错了什么？提前致谢

【问题讨论】：

标签： php html css wordpress

【解决方案1】：

在function.php文件中，

而不是“aloshop”

wp_enqueue_style( 'aloshop',get_stylesheet_directory_uri() . '/style.css',array( $parent_style ));

使用“aloshop-child”调用style.css文件。

wp_enqueue_style( 'aloshop-child',get_stylesheet_directory_uri() . '/style.css',array( $parent_style ));

【讨论】：

【解决方案2】：

我找到了解决办法。我的浏览器会创建 cookie。所以在刷新需要之前按 ctrl+f5 它将清除浏览器。我的代码很好。

【讨论】：