forward widget

[bidemi abiodun]

The Forward theme has a widget that includes address business hours and a location map. It is nicely responsive.

Is there a way to remove the location map from the widget ,so that it will not use 100% width ?

[Bill Robbins]

Good Morning,

It is possible to change the contact widget so that it doesn’t have a map. For the default sidebar, you can just leave the map code out of the widget settings and it won’t be present. For the home page we’ll need a bit of styling to make that possible. Here’s what to do:

1. Go to the Appearance section in your WordPress dashboard and click on Customize.
2. Look down for the advanced section and click on it. Then choose Custom CSS.
3. In the box there, add this:

   
   #home-widgets .organizedthemes-contact.widget {
   	width: 340px;
   }
   
   #home-widgets .organizedthemes-contact .vcard  {
   	float: none;
   	width: 100%;
   	padding: 20px;
   	min-height: none;
   }
   
   #home-widgets .organizedthemes-contact .contact-map {
   	display: none;
   }
   
   @media only screen and (min-width: 1024px) and (max-width: 1180px) {
   	
   	#home-widgets .organizedthemes-contact.widget {
   		width: 280px;
   	}
   	
   }
   
   
   @media only screen and (min-width: 768px) and (max-width: 1023px) {
   	
   	#home-widgets .organizedthemes-contact.widget {
   		width: 330px;
   	}
   
   }
   
   @media only screen and (max-width: 767px) {
   	
   	#home-widgets .organizedthemes-contact.widget {
   		width: 100%;
   	}
   
   }
   

4. Save your changes.

If you have any questions or trouble, let me know.

Thanks,
Bill

[Author]

Posts