Skip to:
Content
Pages
Categories
Search
Top
Bottom

Replacing activity feed Comments Favorite and Delete text links with images (buttons)

  • Avatar of Henry
    Henry
    Member

    @thirstcard

    How could I replace the Comments, Favorite and Delete text links on each activity feed entry with buttons (images). I’d like to display a speach bubble, a heart and a trash can instead of the text links.

    Has anyone been able to do this?

Viewing 7 replies - 1 through 7 (of 7 total)
  • Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    The ‘non template’ approach would be to add an image to the CSS using a background setting then you can use the size / display settings to fix that:

    `a.fav{
    background:whatever;
    }`

    You may need to do a direct call with a.button.fav if styles are overriding though.

    Avatar of Roger Coathup
    Roger Coathup
    Participant

    @rogercoathup

    @thirstcard – Henry, as Tammy suggests — CSS can address this for you; It’s a little more complex than just setting background.

    Have a Google on CSS Image Replacement Techniques — there are several approaches, you can choose your favourite.

    Avatar of Henry
    Henry
    Member

    @thirstcard

    Thanks karmatosed – this was my workaround before coming to the forum for help. I am displaying background images next to each of the Comment, Favorite and Delete text. To have the same text links display on every entry in the activity feed seems slightly redundant to me so wanted to try for images (icons) only.

    This brings me to Roger’s suggestion – CSS image replacement. I thought about hiding the text ‘off screen’ but does this have implications on SEO? Would Google view this as an attempt to ‘hide’ text from the user?

    My ideal solution would be to modify the template directly so that the text links are removed and replaced with images. Not sure if doing this would affect the activity feed’s ajax/js functionality?

    Avatar of Roger Coathup
    Roger Coathup
    Participant

    @rogercoathup

    @thirstcard — image replacement techniques for small pieces of text like this are used throughout the web (find a modern website that doesn’t do it somewhere or other) — Google is not going to punish you for this. Have a read around, there are hundreds of articles on this and SEO.

    Here’s Jeffrey Zeldman’s post on the latest technique to use: http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/

    Avatar of Henry
    Henry
    Member

    @thirstcard

    Thanks for the tips @rogercoathup – in my early days of web dev I had a site penalty for redirecting a page in the wrong way. Since then I seem to question everything I do. You’re right though, i’ve seen it done everywhere and this seems to be a perfectly reasonable approach :}

    Avatar of Henry
    Henry
    Member

    @thirstcard

    @rogercoathup and @karmatosed – it seems since BP version 1.6.1, the wonderful guys who develop BuddyPress have changed the way the activity feed works. The activity feed ajax/js is less reliant on the markup in entry.php which leaves you free to replace the text links with images.

    Massive +1 to @JohnJamesJacoby and the team

    Avatar of gatelli
    gatelli
    Participant

    @gatelli

    so did you succeed? I’m interested by your method

Viewing 7 replies - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.