8 {{ upvoteCount | shortNum }}
8 {{ upvoteCount | shortNum }}

CSS Selectors: No first word? Use PHP (WP example)

by theantihype
6 replies
Heyo,

Here's a server side method of wrapping your first word with a span. You can use the above function, or copy & paste the whole thing to your functions.php

function fancy_title($title) {
$clean = explode(" ", $title);
return "<span class='first'>".$clean[0]."</span>". $clean[1];
}



add_filter('widget_title', fancy_title);
#css #php #selectors #word
  • Profile picture of the author theantihype
    Also here's a jQuery implementation:

    $('.widgettitle').each(function(){
    var me = $(this);
    me.html( me.text().replace(/(^\w+)/,'<span class="first">$1</span>') );
    });
    Signature

    [HOT] (¯`·._.··¸.-~*´¨¯¨`*·~->>120+ QUALITY VIDEO SHARING SITES FOR SEO AWESOMENESS
    Free Tool to Quickly Optimize Your Backlink Anchor Text Distribution

    {{ DiscussionBoard.errors[3895779].message }}
    • Profile picture of the author andrejvasso
      And if your care for the first letter only, use this css pseudo class:

      Code:
      p:first-letter{
font-weight:bold;
}
      {{ DiscussionBoard.errors[3895792].message }}
  • Profile picture of the author theantihype
    Yuppers. Thanks for sharing! :0

    Also, one thing to be VERY aware of; IE does NOT support :last-child. If you are dealing with 3 elements, and just margins/padding, you'll be fine with some intelligent CSS design. If you need 3 unique colors/bgs, etc. then you'll want to rely on jQuery or conditional statements.
    Signature

    [HOT] (¯`·._.··¸.-~*´¨¯¨`*·~->>120+ QUALITY VIDEO SHARING SITES FOR SEO AWESOMENESS
    Free Tool to Quickly Optimize Your Backlink Anchor Text Distribution

    {{ DiscussionBoard.errors[3895876].message }}
    • Profile picture of the author andrejvasso
      Originally Posted by theantihype View Post

      Yuppers. Thanks for sharing! :0
      Thanks goes right back - that WP function is really helping me out a lot - I have agreed to work on a customer´s wordpress blog, allthough I got like 0 experience with this kind of cms - first thoughts on wordpress: i hate it

      just wondering: you know for sure that "last-child" is not being supported by the latest IE9? i will probably try to google the answer right now on myown anyways
      {{ DiscussionBoard.errors[3896820].message }}
  • Profile picture of the author mannenb
    i wanna learn to program lol
    {{ DiscussionBoard.errors[3896180].message }}
  • Profile picture of the author RedMatrix
    Originally Posted by theantihype View Post

    return "<span class='first'>".."</span>". ;

    What if there's more than 2 words in the string $title? I think you need a loop to add the rest of the words after the span.
    Signature

    ~Dave

    {{ DiscussionBoard.errors[3898782].message }}

Trending Topics