mainahgal

It worked beautifully with a couple of tweaks, you are the bomb! Thanks!

I switched to contact form 7. I was able to tweak things with css to get it all looking nice. I appreciate all the help I have received, I’m so thankful for Virtue Themes!

~Lydia

Thank you Kevin for all your help! I appreciate it! I’m trying what you suggested.

I deactivated all those codes except that mapheader which I’m playing around with. When I use nothing at all then the map is full width across the page at the top and the contact form is all the way left, it looks super funny and any text I input into the page itself is between the map and form, not on top of it all. I also cannot get the form to come closer to the top of the page. It just sits hanging in the middle.

Okay, so I fixed the api key and a map is being displayed, Thanks so much! Now I just need to figure out how to align these two elements, the contact form and the map to be beside each other and any text I write in the body to be above.

Thanks so much! I didn’t know that. I’m gonna get that fixed now and see what happens ??

That was done days ago. I have the API all set up exactly how the tutorial says ??

I have done as you said. I got rid of the plugin i was using for a contact form and I’ve done a contact form through virtue on my contact us page. It isn’t displaying the address I inserted into the contact form. And the alignment is all messed up. How can I get the map to display and the contact form to be on another side in the page? Much like the kadance demo contact page?

https://triplumb.com/contact/

Thank you so much for the help! I appreciate it!

I wish I could figure all that out. I’m not versed in those things though. Maybe this will help to distinguish some css that might work.

The only page having issues is the page with an embedded google map and a form builder placed with a shortcode. These two items don’t seem to resize nicely in the mobile view. Is there a quick css fix to make these two items stack in the page or resize to fit side by side nicely in the page in a mobile view?

Okay, I got the topbar menu to work with this custom css code…

@media (max-width: 767px) {
header.banner.headerclass {
    padding-top: 40px;
 }
}

Now the only problem I am struggling with is getting the mobile view of my contact page to look nice in mobile view. Does anybody have any idea what css to use to get the view on mobile to look nice?

Thanks so much!

~Lydia

I cleaned up the custom codes I have…Here they are for anyone’s reference again.

#nav-main ul.sf-menu > li > a:hover {background: #72b33f; color: #fff;}

}

.main {
    width: 100%;

}

.kad-sidebar {
    display: none;
}

.page-header {
display: none;

}

.topbarmenu ul li a {
    font-size: 25px;
}

.home-iconmenu a i {color:#ffffff;} /*icon color*/
.home-iconmenu a h4 {color:#ffffff;} /*text color*/
.home-iconmenu a {background:#444d54;} /*background color*/
.home-iconmenu a:hover {background:#72b33f;} /*background on hover color*/

}

@media (max-width: 768px){
.home-iconmenu {
width: 50%;
float: left;

}

.kad-topbar-right {
    width: 10%;
}
@media (min-width: 1000px) {
.topbar_social ul {
    float: right;
}

.kad-topbar-left {
    width: 70%;
}

.kad-topbar-right {
    width: 30%;

}

@media (min-width: 992px) {
.topbar_social ul {
    float: right;

}

I wish it helped ?? No matter what I do that code doesn’t get the mobile view to be nice.

It worked! You are so awesome! Thank you for your help!

I finally figured it out! This is the code that did the trick!

.home-iconmenu a i {color:#ffffff;} /*icon color*/
.home-iconmenu a h4 {color:#ffffff;} /*text color*/
.home-iconmenu a {background: #384287;} /*background color*/
.home-iconmenu a:hover {background: #6f7ac3;} /*background on hover color*/

Figured it out! Thanks!

[title]
[when]

[location]

[start-location-link newwindow=”yes”]location[/start-location-link]

[description]

[link newwindow=”yes”]See more details[/link]