Skip to content
  • Lebet Log
  • Daptar
WordPress.org

Sunda

  • Themes
  • Plugins
  • News
  • About
  • Get WordPress
Get WordPress

Plugins

  • My Favorites
  • Beta Testing
  • Developers

This plugin hasn’t been tested with the latest 3 major releases of WordPress. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.

Download

Genesis Site Title Styles

By Jackie D'Elia and Ginger Coolidge
  • Details
  • Reviews
  • Installation
  • Development
Support

Description

This plugin adds a span tag around each word in the Genesis site title for separate styling with css. Styling is done with the nth-child() selector.

Style each word separately:

Style the first word:

.site-title span:nth-child(1) {
add your styles here
}

Style the second word:

.site-title span:nth-child(2) {
add your styles here
}

Style the third word:

.site-title span:nth-child(3) {
add your styles here
}

Read more about why we created the plugin here along with examples of how to style them.

Installation

This section describes how to install the plugin and get it working.

  1. Upload the entire genesis-site-title-styles folder to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress
  3. That’s it! There is no settings panel for this plugin.

FAQ

Do this plugin require the Genesis Framework?

This plugin is designed for sites running on the Genesis Framework. While you could successfully activate the plugin on a non-Genesis site, it is useless as the code relies on Genesis-specific actions.

How do I know if the plugin is working?

After activating the plugin, each word in your site title should be wrapped in a span tag.

How can I style the title span tags?

Add this your style.css in the section for your site title. Your class name may be different than .site-title so substitute as needed.

.site-title span:nth-child(1) {
add your styles here
}

Above example would target the first word in the site title. Change the number in parenthesis to target another word, span:nth-child(2) would target the second word, and so on.

.site-title span:nth-child(2) {
color: #99d7da;
font-weight: 600;
}

Above example would change the color and font weight of the second word.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“Genesis Site Title Styles” is open source software. The following people have contributed to this plugin.

Contributors
  • Jackie D'Elia
  • Ginger Coolidge
  • Carrie Dils

Translate “Genesis Site Title Styles” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.10

Replaced logic to recognize words that contain special characters, diacritical marks and symbols. The plugin now will wrap a span tag around everything separated by a space. Any extra spaces are removed.

For example: “BLANCO PRÍBAR®   INC.”

will become “BLANCO PRÍBAR® INC.” and then each word is wrapped in a span tag.

1.01

Edited instructions.

1.0

Released.

0.4

Added lower priority to filter to be sure it loads last.

0.3

Updated code to correct for h1/p tags. See Github

0.2

Changed description. Removed Genesis activation requirement.

0.1

  • Initial release.

Meta

  • Version: 1.10
  • Last updated: 1 year ago
  • Active installations: 300+
  • WordPress Version: 3.8.0 or higher
  • Tested up to: 5.8.0
  • Language:
    English (US)
  • Tags:
    cssgenesislogosite titlespan
  • Advanced View

Ratings

See all
  • 5 stars 2
  • 4 stars 0
  • 3 stars 0
  • 2 stars 0
  • 1 star 0
Log in to submit a review.

Contributors

  • Jackie D'Elia
  • Ginger Coolidge
  • Carrie Dils

Support

Issues resolved in last two months:

0 out of 1

View support forum

Donate

Would you like to support the advancement of this plugin?

Donate to this plugin

  • About
  • News
  • Hosting
  • Donate
  • Swag
  • Documentation
  • Developers
  • Get Involved
  • Learn
  • Showcase
  • Plugins
  • Themes
  • Patterns
  • WordCamp
  • WordPress.TV
  • BuddyPress
  • bbPress
  • WordPress.com
  • Matt
  • Privacy
  • Public Code
WordPress.org
WordPress.org

Sunda

  • Visit our Facebook page
  • Visit our Twitter account
  • Visit our Instagram account
  • Visit our LinkedIn account
Code is Poetry.