Updated on February 18, 2017 There are several ways to scroll smoothly when clicking on jump links (anchors linking to sections within the same page) and the simple code below is from Paulund’s site. But first the sample markup: Step 1 Create a file named say, global.js in your child theme’s js directory (create, if […]
Search Results for: wordpress
How to add Page slug as a body class for static Pages in WordPress
A common method to target elements of a particular static Page is by its ID like this: .page-id-2 Wouldn’t it be handy if you could instead use the slug of the Page like this? .page-about Adding the following in child theme’s functions.php will automatically add a page-slug class to the body element for all static […]
Taxonomy term links grouped by alphabets in WordPress
In the members-only forum, a user asked: Hello! I’m wondering if you could create a tutorial with an archive type page template where the tags are displayed in alphabetical order, separated by letter. Similar to this recipe index (scroll below the main recipe categories). I can get the page template to display the tags in […]
How to set height of an element to Viewport height using jQuery in WordPress
A full height hero section on the front page is a common design element in many websites these days. In this article I share sample code for setting this up in WordPress. The code improves upon what’s there in certain themes by StudioPress like Digital Pro. Step 1 Create a file named say home.js in […]
Combining multiple queries in a single loop using array_merge in WordPress
In a recent Genesis customization I took up, the requirement was to display 1 latest Post and 5 Pages in Home Featured section instead of 6 latest Posts while implementing the Featured Posts Grid with Random Background Colors in Genesis tutorial. The Pages to be featured are those for which a custom field, “Featured on […]
Useful functions for checking Pages and their sub Pages in WordPress
To check a Page by ID for that Page or its direct descendants (sub/child pages) Usage: if ( is_tree( 645 ) ) {} or to check by ID or slug or title: Usage: if ( is_child( 645 ) ) {} or if ( is_child( ‘Services’ ) ) {} or if ( is_child( ‘our-services’ ) ) […]
Displaying a fixed number of posts in WordPress without Pagination
Scenario: Settings > Reading set to show 10 (or whatever number, doesn’t matter) latest blog posts (WordPress default). And you want to display just 3 Posts without links to next sets of paginated pages. So let’s just add this in functions.php: Simple, right? Apparently, that is not sufficient. When you reload your Posts page (the […]
[Video] How to load and use Google Fonts from your website’s server in WordPress
A user asks, How to load google font locally inside a theme font folder? I would like to use a google font within my theme. and not rely on calling it via the functions.php file. We can download the font from Google, generate web font from it using Fontsquirrel generator, upload these files to the […]
How to apply body class in WordPress conditionally for a Page and all its sub Pages
In the members-only forum a user asked: I want to style the h1.entry-title differently for each parent/child page. So About page, and all its sub pages would have a class .blue-bg, Events Page would have .green-bg, etc., with css as below. I have tried using is(tree) code with conditional body_class but it is not working. […]
Using PowerTip to display mouse-following tooltips for Font Awesome Icons in WordPress
In the members-only forum, a user asks: What must be done to use the jQuery PowerTip on some Font Awesome Icons in Textwidgets in your Genesis Sample? Something like this on a text link in a widget. In this tutorial I show how tooltip text can be set up for social media icons in a […]
Recent Comments