I am using WordPress and the PopUp Maker plugin.
I try to center the 'DOWNLOAD NOW' button, but unsuccessfully.
I should probably use a CSS code but have no idea what to do with it.
Any idea how to fix it?
The css you need is the following:
.pum-container .pum-content button {
display: block;
margin: 0 auto;
}
The pum-container and pum-content should be the fitting class for the popup maker plugin.
Add these lines of code to your functions.php:
add_action('wp_enqueue_scripts', 'theme_enqueue_styles');
function theme_enqueue_styles()
{
wp_register_style(THEME_NAME . '-style', THEME_PATH . '/style.css');
wp_enqueue_style(THEME_NAME . '-style');
}
Then add a file called style.css on the same level as your functions.php and add in the css lines from above
Related
I am using gutenberg with wordpress and the sidebar where I can edit the blocks is squeezed to the right, making it impossible for me to edit it:
As you can see in the image, the sidebar is shown partially on the screen and I can´t move to the right.
Here are some things I tried:
1 - Work with another browser (Chrome and Edge). It did not work.
2 - Edditing the code in the plugin (Twenty Twenty), stylesheet in Gutenberg and Stackable plugin:
'mode' => 'edit'
//------------------------------------------------
// Admin CSS
//------------------------------------------------
add_action('admin_head', 'my_custom_fonts');
function my_custom_fonts() {
echo
'<style>
.wp-block {max-width: 900px;}
</style>';
}
As explained in: https://support.advancedcustomfields.com/forums/topic/acf-blocks-cramped-in-right-sidebar-of-editor/
Nothing of these worked. Does anyone have a clue?
Tks
Try to overwrite the css box with this code:
.interface-complementary-area {
width: 380px !important;
}
Or in your theme functions.php add this:
// Wider sidebar on gutenberg backend
function my_wider_sidebar() {
echo
'<style>
.interface-complementary-area{ width: 450px !important; }
</style>';
}
add_action('admin_head', 'my_wider_sidebar');
Intended Results: Add a custom css to customize the Wordpress login page background.
Steps Taken:
Created a new folder in my theme folder called Login. In this, made a new custom css file called custom-login-style.css.
Added a code to the functions.php, that tells Wordpress to load the custom-login-style.css found in the Login folder.
function my_custom_login()
{
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/login/custom-login-style.css" />';
}
add_action('login_head', 'my_custom_login');
The CSS is working fine but has only customized the login form.
Issue: I am not able to customize the background of the login page.
For the page background I have added the following css
body.login {
background: linear-gradient(0deg, #0b4182 1%, #1e88e5 100%) fixed;
}
body, html {
background: linear-gradient(0deg, #0b4182 1%, #1e88e5 100%) fixed;
}
CSS for the background is not working but the css meant for the login form is working
Can you give the link to that page.
Most likely you have some CSS problems.
You can open Chrome inspector and watch what is the result css for your login page.
May be !important is used somewhere and your css is not working.
I would recommend to use inline style to make sure it will override the default style:
function my_custom_login() {
?>
<style>
/* Body style */
body {
background: linear-gradient(0deg, #0b4182 1%, #1e88e5 100%) fixed;
}
/* Logo style */
.login h1 a {
...
}
</style>
<?php
}
add_action('login_head', 'my_custom_login');
Well, there might have been an issue with the functions.php code, so I researced a bit and followed the customization as recommended by the Wordpress Codex https://codex.wordpress.org/Customizing_the_Login_Form
Changed
function my_custom_login()
{
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/login/custom-login-style.css" />';
}
add_action('login_head', 'my_custom_login');
to that found in codex:
function my_login_stylesheet() {
wp_enqueue_style( 'custom-login', get_stylesheet_directory_uri() . '/login/custom-login-style.css' );
}
add_action( 'login_enqueue_scripts', 'my_login_stylesheet' );
and body .login css started working and the background got customised. I am unsure why and what exactly resolved the issue, it may be due to enqueing the stylesheet or may be something else. One thing, its always better to research and implement the Codex in case of Wordpress.
I am going crazy with this, I've been searching all day for a solution for this. I know it should be possible with the display: none; css work around, but I just cant get it to work.
I am trying to remove the "Add Product(s)", "Add fee" and "Add shipping" buttons.
You should try this custom function hooked in admin_head action hiding some Order buttons:
add_action( 'admin_head', 'hidding_some_order_buttons' );
function hidding_some_order_buttons() {
echo '<style>
.post-type-shop_order .wc-order-add-item > button.add-order-item,
.post-type-shop_order .wc-order-add-item > button.add-order-fee,
.post-type-shop_order .wc-order-add-item > button.add-order-shipping{
display: none !important;
}
</style>';
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
Tested and works. you will get something like this:
How to remove Wordpress icon with CSS for not login users in the upper left corner.
Is this possible with css or do I need to go with php?
You can see it on my page http://virtual-forms.com
Edit: added screenshot:
screenshot
create a file with name like removeicon.php and put it in wp-content/plugins/ folder, go to your wp dashboard, plugins and activate it(plugin) and your unwanted icon will disappear for none logged in users:
<?php
/*
Plugin Name: remove icon
*/
function remove_icon_css() {
echo
'<style>
#wp-admin-bar-wp-logo{
display: none;
}
</style>';
}
function remove_icon_code(){
if (!is_user_logged_in()) {
add_action('wp_head', 'remove_icon_css');
}
}
add_action('wp', 'remove_icon_code');
you can also put this code on your /wp-content/themes/{theme-name}/functions.php or child-theme/functions.php
if you want to know about child-themes and functions.php read here
I am using thematic and have created a childtheme.
Whilst trying to style something in the header I discovered that in my head there are some inline stlyes.
How do I get rid of these styles please:
<style type="text/css">
#blog-title, #blog-title a, #blog-description {
color:#blank;
}
#branding {
background-position: center bottom;
background-repeat: no-repeat;
margin-top: 32px;
}
#blog-title, #blog-title a, #blog-description {
display:none;
}
#branding {
height:235px;
width:940px;
padding:0;
}
</style>
</head>
These styles are likely being added by a function hooked to the wp_head action. For example, something in either your theme or maybe in a plugin you have activated is doing something like this:
function hook_css() {
$output = '<style> .example { color : #eee; } </style>';
echo $output;
}
add_action( 'wp_head', 'hook_css', 10 );
You can either delete the function and the hook to wp_head or you can remove the action via the remove_action() function. For example:
remove_action( 'wp_head', 'hook_css', 10 );
Ref:
http://codex.wordpress.org/Function_Reference/remove_action
http://codex.wordpress.org/Plugin_API/Action_Reference/wp_head
Have you got a url for us to look at?
A quick way would be to use jQuery to strip it out.
$('head style').remove();
However removing it properly via php or the theme/plugin would be best
These are generated by theme settings in the admin area, your best option is to find the hook to wp_head and just remove it if it's that necessary.
THanks all.
I have found the offending code. Its burried in the functions.php file in the sample theme that comes with thematic.
Seems a bit weird to me that its in there really... still, it isn't now!