Wordpress

How to update WordPress site urls properly

Run the following SQL query to update your WordPress database with a new site url.

UPDATE wp_options SET option_value = replace(option_value, 'OLD_URL, 'NEW_URL') WHERE option_name = 'home' OR option_name = 'siteurl';
UPDATE wp_posts SET guid = replace(guid,  'OLD_URL, 'NEW_URL');
UPDATE wp_posts SET post_content = replace(post_content,  'OLD_URL, 'NEW_URL');
UPDATE wp_postmeta SET meta_value = replace(meta_value,  'OLD_URL, 'NEW_URL');
UPDATE wp_options SET option_value = replace(option_value,  'OLD_URL, 'NEW_URL');

It’s also possible to download a stand-alone project for this called Database Search and Replace.

Wordpress

Update WordPress login page logo

Set your custom logo to a WordPress login page. You can do this easily by adding the following code to the functions.php.

function my_login_logo() { ?>
    <style type="text/css">
        #login h1 a, .login h1 a {
            background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/images/site-login-logo.png);
		height: 65px;
		width: 320px;
		background-size: 320px 65px;
		background-repeat: no-repeat;
        	padding-bottom: 30px;
        }
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );

You can read more about editing the login page on this url.

Wordpress

Remove welcome panel from dashboard

It’s very easy to –permanent– remove the welcome panel from the dashboard. You can do it with this one single line. Place it in your functions.php

remove_action('welcome_panel', 'wp_welcome_panel');
Wordpress

wp_nav_menu title

It’s easy to add a menu to your WordPress theme. It’s also easy to add the menu title.. You just got to know it 😉

// Add menu title to the template
echo "<h2>" . wp_get_nav_menu_name('nav-menu') . "</h2>";

// Add menu to the template
wp_nav_menu(
  array('theme_location' => 'nav-menu')
); 
Frontend

Simple z-index

A while back I came across some nice z-index articles. When using a z-index I mostly give it a high value. But what if we have a couple of z-indexes with high values…

With the following code it’s possible to have a good overview of all the elements which will be using a z-index.

$z-index: (
    modal              : 200,
    share              : 150,
    navigation         : 100,
    footer             : 90,    
);

@function z-index($key) {
    @return map-get($z-index, $key);
}

@mixin z-index($key) {
    z-index: z-index($key);
}
Continue Reading…
Frontend

Smooth scroll behavior

To get some smooth scrolling on your page, just simply add the following code to your stylesheet. With this small piece of code the movement will be smooth instead of a more static behavior.

html {
  scroll-behavior: smooth;
}
Continue Reading…
Gutenberg Wordpress

Remove Gutenberg blocks

Add the following code to only allow some Gutenberg blocks to your WordPress site.

add_filter('allowed_block_types', 'setAllowedBlocks');

function setAllowedBlocks($allowed_blocks) {
	$allowed_blocks = array(
        'core/image',
		'core/paragraph',
		'core/heading',
		'core/list'
	);

	return $allowed_blocks;
}
Continue Reading…