Linking the PHP file to the CSS file 将PHP文件链接到CSS文件

huangapple go评论60阅读模式
英文:

Linking the PHP file to the CSS file

问题

我想要为WordPress管理区域添加样式。
为此,我已经复制了以下代码到函数文件中,并开始对其进行样式化:

function custom_css()
{
    echo '<style>
    .widefat {
        width: 1700px !important;
        max-width: 1700px !important;
    }
    </style>';
}
add_action('admin_head', 'custom_css');

这种方式会使函数文件变得很拥挤,所以我想将样式放在一个单独的CSS文件中;我该如何在上面的代码中添加我的style.css文件的链接?

我尝试使用以下代码,但没有成功:

{ echo include("/style.css"); }

请注意:你的代码中有一些问题,应该将其修改为正确的PHP语法。

英文:

I want to style the WordPress admin area.
For this purpose, I have copied the following code in the function file and started styling it:

 function custom_css()
    
    { echo &#39;&lt;style&gt;
    
    .widefat {
        width: 1700px !important;
        max-width: 1700px !important;
    }
    
    &lt;/style&gt;&#39;; }
 add_action(&#39;admin_head&#39;,&#39;custom_css&#39;);

this way, the function file becomes very crowded, and that's why I want to style it in a separate CSS file; How can I enter the link of my style.css file in the code above?

I have used this code but it did not work:

{ echo include (&quot;/style.css&quot;); }

答案1

得分: 1

我找到了我的问题的答案。
答案如下:

function custom_css() { 
    echo wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css', array(), '4.0.0' ); 
}

add_action('admin_head','custom_css');
英文:

I found the answer to my question.
The answer is as follows:

function custom_css() { 
    echo wp_enqueue_style( &#39;style&#39;, get_template_directory_uri() . &#39;/style.css&#39;, array(), &#39;4.0.0&#39; ); 
}

add_action(&#39;admin_head&#39;,&#39;custom_css&#39;);

答案2

得分: 1

WordPress主题的CSS文件负责网站的样式和外观。它们位于`/wp-content/themes/`目录中。CSS文件通常命名为`style.css`,你可以尝试一些额外的选项:

在`style.css`中使用`@import`规则链接到另一个文件(如果它是外部托管的)。

`@import url("//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css");`

编辑`header.php`主题以链接到外部样式表。

`<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">`

要在WordPress头部链接CSS文件,你需要首先使用`functions.php`中的`wp_enqueue_scripts`将文件加入队列。之后,你可以使用`get_stylesheet_uri`链接到它。

```php
function roofers_wp_resources(){
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_enqueue_style('name css file', get_template_directory_uri() . 'css file');
}
add_action('wp_enqueue_scripts', 'roofers_wp_resources');

或者,将文件加入队列并指向你的外部CSS网址。

add_action( 'wp_enqueue_scripts', 'register_custom_plugin_styles' );

function register_custom_plugin_styles() {
    wp_register_style( 'style', 'CSS URL' );
    wp_enqueue_style( 'style' );
}

<details>
<summary>英文:</summary>

Wordpress theme&#39;s css files are responsible for the styling and look of the website. They are located in the `/wp-content/themes/` directory. The css files are usually named `style.css`, there are some additional options you can try:

Inside `style.css` use the `@import` at-rule to link to another file (if it is hosted externally). 

`@import url(&quot;//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css&quot;);`

Edit the `header.php` theme to link to an external stylesheet.

`&lt;link href=&quot;//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css&quot; rel=&quot;stylesheet&quot;&gt;`

In order to link a CSS file in WordPress header, you need to first enqueue the file using `wp_enqueue_scripts` from **functions.php** After that, you can then link to it using `get_stylesheet_uri`

function roofers_wp_resources(){
wp_enqueue_style('style', get_stylesheet_uri());
wp_enqueue_style('name css file', get_template_directory_uri() . 'css file');
}
add_action('wp_enqueue_scripts', 'roofers_wp_resources');

or enqueue file pointing to your external css url

add_action( 'wp_enqueue_scripts', 'register_custom_plugin_styles' );

function register_custom_plugin_styles() {
wp_register_style( 'style', 'CSS URL' );
wp_enqueue_style( 'style' );
}


</details>



# 答案3
**得分**: 0

Sure, here is the translated content without the code:

Enqueue a custom stylesheet in the admin

Sometimes you want to load a set of CSS and/or Javascript documents to all admin pages. You can do this from within your plugin or from your theme's function file:

Register and enqueue a custom stylesheet in the WordPress admin.

- Loading CSS:

```php
wp_register_style('custom_wp_admin_css', get_template_directory_uri().'/admin-style.css', false, '1.0.0');
wp_enqueue_style('custom_wp_admin_css'); // Enqueue a style.
  • Loading JavaScript:
wp_register_script('custom_wp_admin_js', get_template_directory_uri().'/admin-script.js', array('jquery-core'), false, true);
wp_enqueue_script('custom_wp_admin_js'); // Enqueue a script.

This code is used to enqueue custom styles and scripts in the WordPress admin panel.

英文:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

/* admin_enqueue_scripts is the proper hook to use when enqueuing scripts and styles that are meant to be used in the administration panel. Despite the name, it is used for enqueuing both scripts and styles. */


Enqueue a custom stylesheet in the admin

Sometimes you want to load a set of CSS and/or Javascript documents to all admin pages. You can do this from within your plugin or from your themes function file:

/**
 * Register and enqueue a custom stylesheet in the WordPress admin.
 */

// get_template_directory_uri() -&gt; Retrieves template directory URI for the active theme.

function wpdocs_enqueue_custom_admin_style() {

        // loading css
        
        wp_register_style( &#39;custom_wp_admin_css&#39;, get_template_directory_uri(). &#39;/admin-style.css&#39;,             false, &#39;1.0.0&#39; );
        
        wp_enqueue_style( &#39;custom_wp_admin_css&#39; ); // Enqueue a style.
        
        // loading js
        
        wp_register_script( &#39;custom_wp_admin_js&#39;, get_template_directory_uri().&#39;/admin-script.js&#39;,             array(&#39;jquery-core&#39;),false, true );
        
        wp_enqueue_script( &#39;custom_wp_admin_js&#39; ); // Enqueue a script.
}

add_action( &#39;admin_enqueue_scripts&#39;, &#39;wpdocs_enqueue_custom_admin_style&#39; );

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年1月6日 10:21:19
  • 转载请务必保留本文链接:https://go.coder-hub.com/75026326.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定