I'm developing my first WordPress plugin for an internship.
I know how to put style on the admin pages by wp_enqueue_style() and admin_enqueue_scripts. I also know wp_enqueue_scripts.
I created a custom post type to store businesses and a single template page in "templates" folder, called "single-myCPT.php".
The problem is: I don't understand how to call a css file for this single page.
The URL is like : mywebsite/myCPT/company
When I use the inspector and I go on "Network", there is no css file detected.
Sorry for my English, I'm a French guy who wants to improve that language :).
You can use wp_enqueue_style() and wp_enqueue_script() on front-end (non-admin) pages as well as admin pages.
Use the wp_enqueue_scripts action for the purpose.
function plugin_name_enqueue_frontend_style() {
wp_enqueue_style(
'plugin_name_frontend',
plugin_dir_url( __FILE__ ) . 'css/frontend.css');
}
add_action( 'wp_enqueue_scripts', 'plugin_name_enqueue_frontend_style' );
But, you should probably also include your frontend css on your admin page; you may need it.
Related
I am a basic WordPress website developer. Due to this I have to do custom css on many client websites.
My question is that, *is it possible to place any code into WordPress CSS, Which load my custom css from any code host like GitHub instead of writing CSS on WordPress custom css. *
*Reason: after giving our code to show my work some clients just run away. *
Question clarification: i want to add custom CSS for WordPress website, but don't want to use WordPress custom CSS. I want it load like bootstraps. Mean i want to host it anywhere else and load remotely.
you can use below function by adding it in functions.php file use that remote url by replacing bootstrap url <br>
function theme_add_custom_css() {
wp_enqueue_style( 'custom-css','https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css');
}
add_action( 'wp_enqueue_scripts', 'theme_add_custom_css' );
I'm very new at wordpress and I'm trying to understand a code from a friend. I went to his wordpress account and edit some test page. However, the page has code inside [ ] tags. How can I edit it?
Here is an example from the wordpress wdit page:
<p style="text-align: center;"><strong>Test- #1 Business Communication App For Project Management & Task Management</strong></p>
<strong>Important Notice:</strong> If you accessed ....</strong></em>, in order for your account to be properly updated.
[register_form]
How can I open/edit the [register_form] code?
This is a shortcode from a plugin or from your theme.
Edit
You can edit it in your theme. If the shortcode is from a plugin, you can overwrite it in your functions.php
function say(){
return "Hello World";
}
add_shortcode( 'register_form', 'say' );
are the tags used to call a function of some plugin that you have active. that specific tag I do not recognize what plugin is, I recommend Contact Form 7, it is easy to use.
If you want to create a PHP function and use it on your page, create a plugin and declare the call as you want. But! Be careful as an error however small will damage your page.
for add tag on wordpress, from your plugin.
function NAME_FUNCTION(){...}
add_shortcode( 'NAME_FUNCTION', 'NAME_TAG' );
and call
[NAME_TAG]
I am new to wordpress and want to know best way to add css from installed and activated plugin.
I have one activated plugin called "social-media" and in that plugin i have created one css file called "social-login-style.css"
I want to include this css file and apply style to my content. How should I add css file in any page so that I can see the effects.
In Short, I want to add social-login-style.css on wp-login.php file.
Whether it is theme or plugin, css or js, any custom addition, wp_enqueue_scripts is the only acton you need for all.
https://codex.wordpress.org/Plugin_API/Action_Reference/wp_enqueue_scripts
function additional_custom_styles() {
/* Enqueue The Styles */
wp_enqueue_style( 'custom-login-style', plugins_url( 'social-login-style.css', __FILE__ ) );
}
add_action( 'wp_enqueue_scripts', 'additional_custom_styles' );
If you it to be added only on login screen then use the following condition,
if ( $GLOBALS['pagenow'] === 'wp-login.php' ) {
// We're on the login page!
}
Hope this one help :)
UPDATE
Please check login_enqueue_scripts. it is designed to add custom scripts into login page only. Works well without any login condition.
https://codex.wordpress.org/Plugin_API/Action_Reference/login_enqueue_scripts
Without saying what you want to achieve is impossible, it certainly is against how WordPress is designed to work. Plugins are supposed to be modules that add to or modify how WordPress works. The folder of a plugin should only hold files pertaining to what the plugin does and, if it's a public plugin, its contents are controlled by a versioning (SVN) system.
In short, adding a file to an existing plugin will not have any effect, regardless of whether the plugin is active or not. And you should not add files to plugins you haven't developed yourself.
To load a CSS file on the login page, one should add an action hook to login_enqueue_scripts, as instructed in Customizing Login Form page of the codex. The stylesheet itself should be placed in either a custom plugin (you could create for your use-case) or inside the current theme folder.
As the title says,
I need to know the name of the theme being used in any drupal page.
For example we can set a default theme and a admin theme for our drupal site basically. For now lets consider only this part and don't get into user specific themes.
So in the above case the home page will load using default_theme and when you do to any admin pages, they will load in admin_theme(seven/bartik).
Now my question is I need to know what theme is being loaded when I navigate to any page of the site. May it be a node/add or node/edit or admin/* or page/* or any page.
Simply when I go to any page I shoudl know the theme name being used in that page and in which hook I can write my conditions.
Based on that I want to do some changes.
I tried using globals $theme, path_to_theme, drupal_get_path etc
When I use them ,they always return the default theme name and not the theme being used in a specific page.
I wrote exit statement for $variables in hook_preprocess_html and it returns value by exiting only if the page is normal users page. But not in admin pages like sitename/admin/content etc.,
Any one who can help.
Thanks in advance
Create a custom module, and put your code in function hook_init(){} in your .module.
No arguments.
function example_init() {
global $theme;
print $theme.'<br />'; // current theme name
print $GLOBALS['theme'].'<br />'; // current theme name
$theme_path = drupal_get_path('theme', $GLOBALS['theme']);
print $theme_path.'<br />'; // path to current theme
}
Bit is a basic question here but can someone confirm that this statement be confirmed: WordPress Pages (certain templates created within) can pull different CSS and JS?
Or - does WordPress only permit universal CSS + JS to be pulled across the entire site?
Thanks for clearing this up.
Depends on what plugin and themes you use. The WordPress/PHP functions wp_enqueue_style() and wp_enqueue_script() can be used literally by everyone (core, themes, plugins, you) to request WordPress to load styles or JavaSctript. You can combine this with WordPress functions to check whether the current page is something you want to filter for (post type, post, front-page, category archive, template, etc.). Here is an example to load a custom style if on front page :
if (is_front_page()) {
wp_enqueue_style('custom-frontpage', 'my/path/to/frontpage.css');
}
You will have to hook this piece of code to the wp_enqueue_script action so that WordPress executes it at the appropriate time. Here is an example using an anonymous function:
add_action('wp_enqueue_scripts', function() {
if (is_front_page())
wp_enqueue_style('custom-frontpage', 'my/path/to/frontpage.css');
});
You can also register your code as a "normal" function and pass the functions name to add_action() instead.
Edit: Enabling and disabling plugins is a bit more difficult, since you can never know how they implement their features without examining the source code. Here are my thoughts on this:
The plugin likely uses the above method (wp_enqueue_styles, wp_enqueue_scripts) to register it's styles and scripts. The plugin, since it assumes to be needed on all pages and posts, does this on every page without the conditional checking described earlier.
You could do one of the following to stop the plugin from doing this:
Identify the place where the plugin loads the styles and scripts and add the if-statement to only do so if the post-ID matches your desired post-ID. This method is bad since your changes are lost every time the plugin is updated.
Write a "counter plugin" (you could just add it to your theme or find a plugin that allowes you to add PHP to your page) that "dequeues" the style and script added by the plugin with inversed conditional tag
The counter-plugin approach would look as follows:
function custom_unregister_plugin() {
if (not the desired blog post) {
wp_dequeue_style('my-plugin-stylesheet-handle');
wp_dequeue_script('my-plugin-script-handle');
}
}
Make sure this function is executed after the enqueuing-code of your plugin by giving it a low priority in the same hook (999 is just an example, test it yourself):
add_action('wp_enqueue_scripts', 'custom_unregister_plugin', 999);
With wp_enqueue_style() you can add stylesheet (https://developer.wordpress.org/reference/functions/wp_enqueue_style/)
You can use it after detecting which template is used
function enqueue_custom_stylesheet() {
if(get_page_template() == 'contact.php')
wp_enqueue_style( 'contact-style', get_template_directory_uri().'/contact.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_custom_stylesheet' );
You can use wp_enqueue_style for your CSS, wp_enqueue_script for your JS, wp_localize_script to pass variables from PHP to JS.
You can call these with hooks like:
funtion enqueue_my_stuff()
{
// your enqueue function calls
}
add_action('wp_enqueue_scripts','enqueue_my_stuff'); //front end
add_action('admin_enqueue_scripts','enqueue_my_stuff'); //admin panel
add_action('login_enqueue_scripts','enqueue_my_stuff'); //login screen