How can I put style.css latest file? - css

in wordpress how can I put style.css lastest file of all stylesheet file?
I tried
function stylecssAlwaysLast() {
wp_register_style( 'mystyle', get_stylesheet_directory_uri() .'/style.css');
wp_enqueue_style( 'mystyle' );
}
add_action('wp_enqueue_scripts','stylecssAlwaysLast',1000);
but add file last but dont remove the style.css add by default wordpress code. In other words: at the last i've two files style.css :-(
UPDATE
I get it! :-)
Goals:
remove default theme style.css;
my stylesheet must to be the latest item;
if exist the compressed version use it in place of default versione;
...and the answers is...:
function styleCompressedLatest() {
// delete style.css
wp_dequeue_style('wp-bootstrap');
wp_deregister_style('wp-bootstrap');
// text if exist compressed version
if(file_exists(get_stylesheet_directory().'/style_compressed.css')) {
$style = get_stylesheet_directory_uri() .'/style_compressed.css';
} else {
$style = get_stylesheet_directory_uri() .'/style.css';
}
// add my style.css
wp_enqueue_style( 'mystyle', $style);
}
add_action('wp_enqueue_scripts','styleCompressedLatest',1000);
Somebody knows a best way?

You are on the right track, just don't call your stylesheet style.css and both will be included.
Also, you don't need to register and enqueue a style if you are only using it once, just use wp_enqueue_style() as below.
function stylecssAlwaysLast() {
wp_enqueue_style( 'mystyle', get_stylesheet_directory_uri() .'/mystyle.css');
}
add_action('wp_enqueue_scripts','stylecssAlwaysLast',1000);

Related

style in css is not updating in wodpress

i have this code to import the css it's working fine but not updating my css latest update right now
// style imports
function themeslug_enqueue_style() {
wp_enqueue_style( 'bootstrap', plugins_url('/bootstrap/css/bootstrap.css', __FILE__), false );
wp_enqueue_style( 'my-style', plugins_url('/assets/mystyle.css', __FILE__), false );
}
add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_style' );
add_action('showForm', 'showInterface');
this is my plugin directory
turnvoer-calculator
assets
mystyle.css
turnover-calculator.php
If your stylesheet (mystyle.css) success enqueue but it's not update your latest changes - most of the case is because of cache issue (usually have at least 2 layers of cache in a WP site).
So you need to force your WP site to load the newest version of your stylesheet by adding time argument to your stylesheet's url. Your case, using this code:
wp_enqueue_style( 'my-style', plugins_url('/assets/mystyle.css?time=', __FILE__).time(), [], false );
Please replace it with your code and try again.

I can't enqueue css using a function in WordPress

My stylesheet is enqueued if i use
<link rel = "stylesheet" type = "text/css" href = "<?php echo get_template_directory_uri();?>/style.css">
but it's not included when i use
function include_css(){
wp_enqueue_style('main_css',get_stylesheet_uri());
}
add_action('wp_enqueue_scripts','include_css');
You may correct the code like this :
function include_css(){
wp_enqueue_style('main_css',get_template_directory_uri().'/style.css');
}
add_action('wp_enqueue_scripts','include_css');
The issue is that you are trying to enqueue the css file without specifying it's complete url the code you use i.e
> wp_enqueue_style('main_css',get_stylesheet_uri());
This means that you are adding the style.css file which is always on the root directory but still you are giving name as main_css first make sure which css you want to add then someone will able to properly answer your question and the css you are trying to add is in which directory.
Please refer to this link get_stylesheet_uri
To enqueue a stylesheet use this in functions.php
1.we need to register our stylesheet.
2.we should enqueue it.
3.Hook to an action
4.call the function where you want to enqueue it.
function include_css()
{
wp_register_style('main_css',get_template_directory_uri().'/style.css');
wp_enqueue_style('main_css');
}
add_action('wp_enqueue_scripts','include_css');
call,
<?php wp_head();?>
in the place you want to enqueue it.(mostly in header.)
Please add this code in theme's functions.php
function enqueue_scripts() {
wp_enqueue_style('style', get_stylesheet_directory_uri() . '/style.css', array());
}
add_action( 'wp_enqueue_scripts', 'enqueue_scripts' );

Wordpress | If there any plugins to create things like those

I have this styles created in dynamic page with pure html, css, some js libraries. I want to add it to wordpress theme, If there any plugins can create those styles, or how can i add the code by myself ?
Style1
Style2
To add your own styles:
1) Create a child-theme
2) Add your styles to the child theme
3) Setup the child theme lo load the parent's styles.
4) If you use different css files for the added styles, load them after the child-theme's style.css is loaded.
5) For the js files you will do the same as for css files.
To load child-themes you will need make changes to the functions.php of the child-them in order to hook into wp_enqueue_scripts action.
add_action( 'wp_enqueue_scripts', 'load_aditional_styles' );
and use wp_enqueue_style();
function oad_aditional_styles(){
wp_enqueue_style( 'my_style_1', get_stylesheet_directory_uri() . '/Style1.css', array(), all );
wp_enqueue_style( 'my_style_2', get_stylesheet_directory_uri() . '/Style2.css', array(), all );
wp_enqueue_script( 'my-js', get_stylesheet_directory_uri() . 'MuJsFile.js', array(),null, true );
}
(This assumes Style1.css and Style2.css are in the root of the child-theme, otherwise you need to add the corresponding folders to the file name)
For js files, the empty array indicates no dependancies, but if you have dependancies like jQuery, the jquery handle has to be added there.

Custom style sheet tag in wordpress

I'd like to custom stylesheet code in wordpress.
global $is_chrome;
if($is_chrome){
add_filter("style_loader_tag", function($tag){
return str_replace("rel='stylesheet' " ,"rel='preload' as='style' onload=\"this.rel='stylesheet'\" ", $tag);
});
}
but this is effectable for css in asset folder.
this is not good for [themes > mytheme > ooo.css].
how can i get through this.
thankyou in advance.
Enqueueing styles is the proper way to add a style sheet in WordPress
Paste the below code in functions.php and change path and filename.css to your path and filename
function themename_enqueue_style() {
wp_enqueue_style( 'customCSS', get_template_directory_uri() . '/path/filename.css' );
}
add_action( 'wp_enqueue_scripts', 'themename_enqueue_style' );
get_template_directory_uri() prints the template directory link.
Example:
www.example.com/wp-content/themes/themename

what to do after registering and enqueing a css file inside a plugin folder to use it

I have been looking for an answer for this in SOF but didn't find a clear answer
I have a plugin that forces pages to be shown when certain conditions are met. but when i try to include css files for styling i get no response .
I tried to include the file using normal html and this was a failure
then tried the wp_register_style and wp_enqueue_style as such:
function rw_add_style(){
$rw_path = plugins_url('kawaleb/style.css');
wp_register_style('testili',plugins_url('kawaleb/style.css'));
wp_enqueue_style( 'testili' );
}
add_action ('wp_enqueue_scripts','rw_add_style');
wp_enqueue_style( 'testili' );
}
I placed this code on the page that should be shown when the conditions are met
What I don't know here is how to procede after enqueing !
do I need to use html to include the stylesheet file ( and then what is the use of enqueing ?) or does it do that by itself (and then what I am missing here ? )
In the doc of codex they dont go further than telling you to register the style then enqueue it !!!
Thank you all :)
You don't need to register the style, you can just enqueue it. Also, you mentioned that you've put the code in the file where you'd like it to display, you should put it in the index file of your plugin, so in /your-plugin/index.php or whatever the main file is called, add this code:
function rw_add_style() {
wp_enqueue_style( 'testili', plugins_url( 'kawaleb/style.css' ) );
}
add_action( 'wp_enqueue_scripts', 'rw_add_style' );
If you need it only on a certain page then you should add your conditional within the function, so you could do this for example:
function rw_add_style() {
global $post;
if ( $post->post_name == 'post_name' ) {
wp_enqueue_style( 'testili', plugins_url( 'kawaleb/style.css' ) );
}
}
add_action( 'wp_enqueue_scripts', 'rw_add_style' );
And you can work out what the post name is for the page you need to enqueue it for by temporarily adding the following code to the page template:
global $post;
echo $post->post_name;
To be clear, you don't need to add any html <link> to include the CSS as you're right, there would be no point in enqueuing it then. Just add the enqueue as I described above in the main index file of your plugin and it will be automatically included in the wp_head() in your header and output just before the </head>.
I hope this helps. Good luck. =)

Resources