将 CSS 库集成到 WordPress 中的最简单方法是啥

Posted 2023-03-07

【中文标题】将 CSS 库集成到 WordPress 中的最简单方法是啥

【英文标题】：Whats the easiset way to integrate a CSS Library into WordPress将 CSS 库集成到 WordPress 中的最简单方法是什么

【发布时间】：2021-08-13 03:47:36

【问题描述】：

我正在寻找一种简单快捷的最佳方式来让 Bootstrap 或 Tailwind CSS 在我的 WordPress 中运行，以帮助保持页面和帖子。

是否有要安装的插件或将 sn-p 代码放入 functions.php 中 - 我仍在学习 Web 开发，并且非常了解它。感谢您的帮助！

【问题讨论】：

欢迎来到 Stack Overflow！ wp_enqueue_scripts() 是你的朋友。或者，只需将其放入 header.php 即可（尽管入队是首选方法）。

我似乎无法让它为 TailwindCSS 工作：<?php function add_theme_codes() wp_enqueue_style( ‘style’, ‘https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css’); add_action( ‘wp_enqueue_scripts’, ‘add_theme_codes’ ); ?>

您在哪里添加该代码？而且，您似乎正在使用“智能”引号。那些需要更改为常规引号'

【参考方案1】：

谢谢你，感谢我在 elsewehere 找到的一些代码，我还能够通过一个名为 Code Snippets 的 WordPress 插件将其加入队列，但它也可以在 functions.php 文件中使用。

<?php
function pwwp_enqueue_my_scripts() 
    // jQuery is stated as a dependancy of bootstrap-js - it will be loaded by WordPress before the BS scripts 
    wp_enqueue_script( 'bootstrap-js', '//stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js', array('jquery'), true); // all the bootstrap javascript goodness

add_action('wp_enqueue_scripts', 'pwwp_enqueue_my_scripts');

function pwwp_enqueue_my_styles() 
    wp_enqueue_style( 'bootstrap', '//stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css' );

    // this will add the stylesheet from it's default theme location if your theme doesn't already
    //wp_enqueue_style( 'my-style', get_template_directory_uri() . '/style.css');

add_action('wp_enqueue_scripts', 'pwwp_enqueue_my_styles');
?>

这是用于 TailwindCSS 的一个

<?php
    function pwwp_enqueue_my_styles() 
    wp_enqueue_style( 'bootstrap', '//unpkg.com/tailwindcss@2.1.2/dist/tailwind.min.css' );

    // this will add the stylesheet from it's default theme location if your theme doesn't already
    //wp_enqueue_style( 'my-style', get_template_directory_uri() . '/style.css');

add_action('wp_enqueue_scripts', 'pwwp_enqueue_my_styles');
?>