BuddyDev

Search

CSS styling the Invite Friends plugin in Youzer

Tagged: , ,

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on April 25, 2019 at 10:21 am #22588

    Hi everyone in this awesome community 🙂

    This is a bit of a plea as the support forum for this plugin is abandoned 🙁 (https://wordpress.org/support/plugin/invite-anyone/) I am looking to know what the CSS class is for this or even what can make this look less clumped together (spaced out well with a bit of styling…)

    This is due to the Youzer plugin removing the CSS, so I need it again to put it in the global settings. (yep, same story).

    Anyone got any ideas, or even what the class is for this? I would show you the link here but you’d need to be logged in. I am trying to get this looking less squished as well, maybe 1px between each line but i’d have to play about with that…

    Any suggestions / ideas are welcome.

    Many thanks to this community.

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on April 25, 2019 at 10:26 am #22589

    Here is a screenshot:

    https://prntscr.com/ngo4ln

  • Keymaster
    (BuddyDev Team)
    Posts: 24623
    Brajesh Singh on April 25, 2019 at 4:16 pm #22601

    Hi Kristian,
    You can add the following css

    

.widget.invite-anyone p,
.widget.invite-anyone form {
  padding: 20px;
}

    That should make it a bit better.

    Reagards
    Brajesh

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on April 29, 2019 at 6:10 pm #22664

    Thank you Brajesh, and sorry for the late reply. I wasn’t very well but feel better now 🙂

    The code is great! thanks! but, is there a way I could adjust the left side too? it seems to only work on the right hand side 🙁

    Here’s the new screenshot:

    https://prntscr.com/nidytl

    Any CSS Suggestions my friend?

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on April 30, 2019 at 8:17 am #22681
    This reply has been marked as private.
  • Keymaster
    (BuddyDev Team)
    Posts: 24623
    Brajesh Singh on April 30, 2019 at 12:09 pm #22693

    Please link me to a page showing the form.

    Thank you
    Brajesh

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on April 30, 2019 at 5:38 pm #22695

    Hey I already did in the last message, but here it is again: – (You should see the widget on the right after logging in):

    https://taipeiexpats.com/activity/

    it is titled: “INVITE FRIENDS TO JOIN TAIPEI EXPATS”

  • Keymaster
    (BuddyDev Team)
    Posts: 24623
    Brajesh Singh on April 30, 2019 at 5:43 pm #22696

    Try this

    
.widget-content.invite-anyone {
    padding: 20px;
}

.invite-anyone .widget-title {
   margin-bottom: 15px;
}

    Regards
    Brajesh

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on April 30, 2019 at 7:58 pm #22698

    It’s perfect! Brajesh, thank you. I even added some of my own to your amazing code to pad out the top text, too.

    The widget is looking and being awesome 😀

    Thanks again, sir!

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on May 1, 2019 at 8:50 am #22704

    Oh! sorry, Brajesh, just one last thing.

    I noticed the text is clumped together without any space below each line.

    What can I add to your plugin to provide a little bit between each text line?

    Thanks again, sir 🙂

You must be logged in to reply to this topic.

This topic is: not resolved