wordpress registration page - create a style sheet for it - css

I want to style the registration page background in wordpress. I put some styles into my child-theme but they weren't picked up - think because the page isn't pulling in my style.css which I am doing this way in my functions.php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
Ideally I don't want to edit the login.css in the admin section.
How do i get my own style sheet to be loaded for the registration page?

Use:
add_action( 'login_enqueue_scripts', 'theme_enqueue_styles' );
There's also ways to edit the logo and so forth, without having to resolve to CSS. Read more here: https://codex.wordpress.org/Customizing_the_Login_Form

Related

Move child theme style.css without plugin

I am optimizing performance of my WordPress website
The style.css of my child theme is coming under render blocking resources I need to move it from header to footer
Code inside Child theme's function.php is
function softek_child_enqueue_styles() {
wp_enqueue_style( 'softek-child-style',
get_stylesheet_directory_uri() . '/style.css',
array( 'softek-style' ),
1.0
);
}
add_action( 'wp_enqueue_scripts', 'softek_child_enqueue_styles', 99 );
I have commented this code but the file is still loading

Loading a CSS file to a new theme in WordPress

I am making a new theme for WordPress using guide from this site https://www.taniarascia.com/developing-a-wordpress-theme-from-scratch.
The writer of tutorial the says that using <link href="" rel="stylesheet">
is not the most correct way to load scripts.
I am thinking to use wp_enqueue_style() and add_action() on function.php to load the .css file. I have already had three files, index.php, function.php, and style.css in my theme directory but I can't seem to make it work.
Below is the code I use to load the .css file:
<?php
function enqueue_my_styles(){
wp_enqueue_style('style', get_template_directory_uri().'/style.css');
}
add_action( 'wp_enqueue_scripts', 'enqueue_my_styles' );
?>
Is your functions file named functions.php or function.php? This should be functions.php and is fundamental.
Your code looks correct, but could actually be shortened a little as in the twentyfifteen Wordpress template;
function twentyfifteen_scripts() {
// Load our main stylesheet.
wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );
}
add_action( 'wp_enqueue_scripts', 'twentyfifteen_scripts' );
You'd use get_template_directory_uri() for loading a custom file within the template directory.
function my_custom_styles() {
wp_enqueue_style( 'my-custom-style', get_template_directory_uri() . '/custom-style.css');
}
add_action( 'wp_enqueue_scripts', 'my_custom_styles' );

Why is it better to use wp_enqueue_style than the link tag in WordPress?

I am pretty new to WordPress development. I read that it's better to use wp_enqueue_style and do_action inside the functions.php file rather than linking CSS files directly as I would when not using WordPress.
Why this is a best practice? What are its advantages?
If you have activated child theme then use get_template_directory_uri() functions.
If you have activated parent theme then use get_stylesheet_directory_uri() functions.
get_template_directory_uri will always refer to the parent theme folder for assets.
get_stylesheet_directory_uri will refer to the "current" theme folder for assets (which could be the parent or the child, depending on where it is called).
Child theme example:
wp_enqueue_style( 'my_child_styles', get_stylesheet_directory_uri().'/style.css' );
Parent theme Example
wp_enqueue_style( 'my_parent_styles', get_template_directory_uri().'/style.css' );
Method-1
// load css into the website's front-end
function mytheme_enqueue_style() {
wp_enqueue_style( 'mytheme-style', get_stylesheet_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_style' );
Method-2
// Add this code in your functions.php
function add_stylesheet_to_head() {
echo "<link href='".get_stylesheet_directory_uri()."/style.css' rel='stylesheet' type='text/css'>";
}
add_action( 'wp_head', 'add_stylesheet_to_head' );
Because wp-enqueue-style adds scripts/styles to the queue.
Registers the style if source provided (does NOT overwrite) and enqueues.

unable to include stylesheet for page template in child theme

I have created a child theme and have created a page-splash.php in the child theme and have also created a page-splash.css for this page, but somehow I am unable to load the page-splash.css for the page-splash.php file.
This is my code in the functions.php ( in the child theme folder)
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
function splash_enqueue_style() {
wp_enqueue_style( 'page-splash', get_template_directory_uri().'/css/page-spash.css' );
}
add_action( 'wp_enqueue_scripts', 'splash_enqueue_style' );
?>
I'd really appreciate your help on this.
What am I doing wrong??
I am working in localhost and will transfer these files to a working domain after things are working properly.
Couple of things, starting with the simplest -- You've got a typo in your page-splash.css file path. You've got it typed as page-spash.css
Additionally, there's probably no need to call two separate functions for this. You could enqueue both of those styles in one call like so:
function splash_enqueue_style() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
if(is_page_template('page-splash.php'){
//Path to your template.. if it's in a dir, include it before the file
wp_enqueue_style( 'page-splash', get_template_directory_uri().'/css/page-splash.css' );
}
}
add_action( 'wp_enqueue_scripts', 'splash_enqueue_style' );
Well, I kept on searching for answers and I have found it.
It seems that using wp_head() is important if you want to load all javascript
or css files and it started to work when I did that.

How to add a new stylesheet to my wordpress

I've been trying with no success to add a new stylesheet to my template. It's my first time creating a wordpress template. I'm using underscore and this is what I have in functions.php:
style.css is the stylesheet shipped with the template starter.
wp_enqueue_style( 'name-style', get_stylesheet_uri() );
I just want to add foundation-icons.css, foundation.min.css and custom.css. Any help? Thanks.
This is how I do it in all of my templates
/* Enqueue Scripts
-----------------------------------------------------------------*/
add_action( 'wp_enqueue_scripts', 'template_enqueue_scripts' );
function template_enqueue_scripts() {
wp_register_style('Sub-CSS', get_template_directory_uri() .'sub-style.css');
wp_enqueue_style( 'Sub-CSS');
}
This is the best way to my knowledge, like I said, I always do it this way. It works flawlessly, and I have never had a problem doing it this way.
Edit
You will notice that no one else uses wp_register_style, and the wp_register_style is the safest way to setup your style for actual enqueue.
Make sure that you wrap the wp_register_style & wp_enqueue_style in a function.
Try this code :
<?php
add_action( 'wp_enqueue_scripts', 'safely_add_stylesheet' );
/**
* Add stylesheet to the page
*/
function safely_add_stylesheet() {
wp_enqueue_style( 'prefix-style', plugins_url('style.css', __FILE__) );
}
?>

Resources