Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Change look of like button

This discussion is related to the I Like This ( Plugin ) addon.

When I enable this plugin, the like button looks like a rather large submit button, like an old school form style button, its doesn't adhere to any theme guidlines apparently.

How do I alter the look of the button to just be a plain text link and not a form submit button with like on it.

thx

Comments

  • phreakphreak Vanilla*APP (White Label) & Vanilla*Skins Shop MVP
    edited August 2013

    Google: "CSS" it's a design language that can help you change it to your needs.

    • VanillaAPP | iOS & Android App for Vanilla - White label app for Vanilla Forums OS
    • VanillaSkins | Plugins, Themes, Graphics and Custom Development for Vanilla
    UnderDog
  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    @lxle

    try this , although it would help more if you gave a link to see , that way it is not a guess.

    .Meta i.icon-thumbs-up img{
    display:none;
    }

  • lxlelxle New
    edited August 2013

    here is a screenshot of the like button, i tried your guess vrijvlinder but it didn't work... i also tried altering the .css code but that is really on for the highlighting/rollover color.

    any help is appreciated.

    http://picpaste.com/541cab153e4249924ff6f2cbc912af3f.jpg

  • Change the HTML of the button directly in the FormatLikes function in the plugin's default.php. Search for "button" in the default.php file if you can't find it.

    Add Pages to Vanilla with the Basic Pages app

  • TamaTama United Kingdom ✭✭✭

    Go to plugins/LikeThis/css/like.css

    looks like you want to remove

    span.likes
    {
        background: #222;
        border: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    color: #222;
    margin: 0;
    padding-left: 5px !important;
    padding-right: 5px;
    border: 0;
    outline: 0;
    text-align: center;
    .Meta i.icon-thumbs-up img{ display:none; }
    }
    
    vrijvlinderUnderDog
  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    @lxle

    screenshots are nice but one can't see the code of your page and tell you what you need to do. All themes vary and affect other things. Use firebug or any web inspector to see what and where you need to add he changes.

    If you do not provide a link to see or the code in question, we are just guessing and you are wasting your time and effort.

    Also, make sure that you copy and write whatever code you are given here carefully so as to avoid typos and errors missing or extra brackets.

  • @Shadowdare said:
    Change the HTML of the button directly in the FormatLikes function in the plugin's default.php. Search for "button" in the default.php file if you can't find it.

    Thanks man, that did the trick. I wasn't sure about that area and how it interacted with the script once it was removed, once the button was removed 'Like' appeared in text where the button once was.

    thanks again.

    vrijvlinderUnderDog
  • hbfhbf wiki guy? MVP

    i've flip flopped on that formating a couple times. theres a thread around here somewhere where people were asking for it to use button code formatting, i obliged, but i'm not sure i like the look. anyway, glad you got it figured out.

Sign In or Register to comment.