Home › Forums › Jevelin Theme › Foodie Demo CF7 Styling
Home › Forums › Jevelin Theme › Foodie Demo CF7 Styling
Hi there!
Love the theme. I just imported the foodie demo and it didn’t come with CF7, So I downloaded it and added a form to the home page where people can reserve a table, but it doesn’t look the same, what kind of styling do I have to apply to the form to make it look like the demo?
This is my website: https://restaurant.modernwebmedia.com/
Hi @modernwebmedia,
I hope you are well today and thank you for your question.
You can try changing its style as shown in the attached screenshot.
Best regards,
Shufflehound team
Sorry Im not talking about the style, im talking about the layout.
I want the same fields and the same layout as in the demo.
To get same fields please create a contact form in the contact form 7 plugins and use the same fields as described in the below page.
https://contactform7.com/docs/
You will get the same layout after setting the search form style as described above.
Hi again!
I all the fields but i’m talking about the actual code in CF7… I attached a screenshot of what Im talking about.
Have you set the contact form 7 style as displayed in the above shared screenshot?
Would you mind if I log in to your site and do some troubleshooting? If this is ok then could you please temporary share me your site admin login details privately by adding them in the box having text “Enter your private content here (only you and forum moderators will be able see it)”?
Here it is
Solution for this topic
I logged into your site and changed the contact form markup to achieve it as shown in the attached screenshot.
Could you please confirm it?
Solution for this topic
Here is its markup for easy reference:
<div class="row"> <div class="col-md-6"> [text* first-name placeholder "First Name*"] </div> <div class="col-md-6"> [text* last-name placeholder "Last Name*"] </div> </div> <div class="row"> <div class="col-md-6"> [email* your-email placeholder "Email Address*"] </div> <div class="col-md-6"> [tel* tel-803 placeholder "Phone Number*"] </div> </div> <div class="row"> <div class="col-md-4"> [date date-984 placeholder "dd/mm/yyyy"] </div> <div class="col-md-4"> [select* menu-548 "Time*" "9:00 AM" "9:30" "10:00" "10:30" "11:00" "11:30" "12:00 PM" "12:30" "1:00" "1:30" "2:00" "2:30" "3:00" "3:30" "4:00" "4:30" "5:00" "5:30" "6:00" "6:30" "7:00" "7:30" "8:00" ] </div> <div class="col-md-4"> [select menu-896 "Persons*" "1" "2" "3" "4" "5" "6" "7" "8" "9" "10" "11" "12" "13" "14" "15" ] </div> </div> <div class="text-center"> [submit "Book Now"] </div>
Perfect ! It looks really good! Thank you for all the help!
You are most welcome here 🙂