BuddyDev

Search

Contact Form CSS

  • Participant
    Level: Initiated
    Posts: 19
    John Waters on January 6, 2023 at 4:50 pm #47848

    Hi,

    Am using contact form on my site.

    Is there a way to bring the contact form into the other sections of the members profile ?

    Do you have an example of rendering the form in CSS, display: flex etc ? I have just installed it, and it looks like it needs a bit of work (most likely my bad, it is 4am here), will revisit tomorrow

    Cheers and thanks

  • Keymaster
    (BuddyDev Team)
    Posts: 24599
    Brajesh Singh on January 6, 2023 at 8:04 pm #47855

    Hi John,
    Thank you for the question.

    1. Are you referring to BuddyPress User Contact Form plugin?

    2. yes, it can be moved to other sections on profile. Please let me know where you want to move it?

    3. We have provided basic css to let it mostly inherit styles from the theme being used. Please let me know where & how you want it to look like and will assist.

    Have a great day!

    Regards
    Brajesh

  • Participant
    Level: Initiated
    Posts: 19
    John Waters on January 7, 2023 at 3:50 am #47858

    Awesome, and thanks for replying.

    Yes, I am referring to the BuddyPress User Contact Form plugin.

    At the moment, I have it on the profile tab: Contact Me: and example is at https://shuffles.com.au/bp/members/gardenofvegan/contact-me/

    I would also like a button or similar, on the members sidebar, which will unhide or show the contact form for users who are not logged in ?

    I am using Youzify as a theme, so I am a little unsure who to ask, maybe I should be asking you for a shortcode or similar as well

    Many thanks

  • Participant
    Level: Initiated
    Posts: 19
    John Waters on January 7, 2023 at 5:26 am #47859

    Same also for Buddyblog form CSS, do you have a generic set of CSS settings to kick start the rendering?

  • Keymaster
    (BuddyDev Team)
    Posts: 24599
    Brajesh Singh on January 8, 2023 at 12:28 am #47872

    Hi John,
    Thank you for the link. I see what is happening there now. You are using Youzer which is forcefully resetting all the theme styles.
    All our plugins uses the ‘standard-form’ class on form element, so any theme which follows BuddyPress’s convention work. Youzify/Youzer does not follow the convention and that’s why it is broken.

    Please allow us couple of days, we will add the css to override Youzer’s.

    Regards
    Brajesh

  • Keymaster
    (BuddyDev Team)
    Posts: 24599
    Brajesh Singh on January 15, 2023 at 5:43 pm #48011

    Hi John,
    Thank you for your patience.

    Here is a css snippet I am using for the cntatc form compatibility

    
#youzify .bp-user-contact-form label {
    display: block;
    margin-bottom: 1em;
}

#youzify .bp-user-contact-form label input,
#youzify .bp-user-contact-form label textarea {
    display: block;
    margin-top: 5px;
}

    and here is how it looks.

    https://i.ibb.co/xJ0msd6/Selection-038.png

    Does this snippet work for you? If not, Do you have a staging site? Please link me and I will update the snippet.

    I am also going to post for BuddyBlog in next couple of hours.

    Regards
    Brajesh

    P.S: – In next version of Contact form, we will have the css included and no need to do anything in future.

  • Keymaster
    (BuddyDev Team)
    Posts: 24599
    Brajesh Singh on January 15, 2023 at 8:40 pm #48012

    Hi John,
    I had a look at compatibility with Youzer for BuddyBlog Pro.
    Here is how the form is looking to me.
    https://i.ibb.co/ngXBKcY/Selection-039.png

    I do see that it is very different from your screenshot. Do you have a staging site? Please provide me access to it to help you with it.

    Thank you
    Brajesh

You must be logged in to reply to this topic.

This topic is: not resolved