Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • March 14, 2014 at 10:23 pm #237845
    wawrzy

    Hi,

    This is my first post here and probably not the last one, apologies in advance.
    Thanks for the nice theme, quite handy and good customizations, however there are many things I don’t understand.

    Link of the website I’m making: http://wlh-location.com/location/

    – Basically I want the Google map to have the same height and width as the easy slider and I want both of them to be responsive, meaning, if I reduce the windows, the height and width decreases proportionally.
    Here however, Google maps next to it do not behave the same way as the slider. Check here: http://www.responsinator.com/?url=wlh-

    location.com%2Flocation

    I don’t think I understood the concept of responsiveness in this theme. To be honest, I’m not good in coding and webdesign, so please

    forgive me in advance.
    For eg. I uploaded images of 495×330 in the easy slider. I said to easy slider that the slideshow image size must be 495×330. Yet, once

    online, the image is 569×380. Just to try, If I change the slideshow image size to 120×120, the image is 569×569… Weird.
    I guess it’s because the 1/2 layout I’ve chose gives me this 569px=1210px-47%. So if I don’t want this, how can I simply put a Google map

    next to an easy slider with the size of my choice and still keeping them responsive?

    Anyway, I decided to remove the size in the widget and leave height and width at 100%.
    However, at full screen, the height of the map is lower than the slider. When reduced the height is not responsive and never decreases. Could you please help me for this?

    – Also, How to replace this simple address by the address + itinerary/nearby/plus, which sends directly to google maps if we select one of these 3 options?

    – Could you please also tell me how to display automatically this address windows without having to click on the pin?

    – How to display multiple locations on the same map? (I would probably disable the address windows to avoid overlapping) (or the best would be if one location visible on the map frame, display

    address, if more than one, don’t.)

    – How to remove the footer information like “report error” and others?

    I’m sorry for this long post and really thank you in advance for your help.
    Best Regards
    Wawrzy

    March 17, 2014 at 7:26 pm #238937
    David

    Hi wawrzy!

    – To make the google map the same height use the following snippet. For the responsive part you need to add the media queries needed for this i will provide those below too, however you need to calculate the height of the map accordingly.

    .content .avia_google_maps_container {
height: 323px;
}
// Media queries.
@media screen and (max-width: 1024px) { //ipad landscape }  //inside of it place the above code and it's correspondant height.
@media screen and (max-width: 768px) { //ipad portrait }
@media screen and (max-width: 360px) { //iphone 5 }
@media screen and (max-width: 320px) { //iphone 4 }

    – For the other points please attach an screenshot of the section, along with the respective links for me to check those out.

    Let me know when you have those ready.

    Regards,
    David

    • This reply was modified 10 years, 8 months ago by David.
    March 17, 2014 at 9:06 pm #238992
    wawrzy

    Hi David,
    Many thanks for your reply.

    I managed to integrate the media queries properly after a lot of digging (I’m a web design noob).
    However, I don’t understand why I have to do it for Google map widget when the rest of the website is completely responsive already.

    Right now I’m putting around 20 media queries for most of the mobile and tables, which is only for google map widget from Enfold. Still the easy slider and and map don’t response the same way as I haven’t integrate all dimensions.
    Is there a way to integrate the responsive settings of this widget to the theme please?
    This question can be brought to any widget or image I’ll add in the future.

    I’ll forward the screenshots tomorrow. Thanks again for your help.
    Regards
    Wawrzy

    March 19, 2014 at 8:57 am #239932
    Dude

    Hey!

    Actually there’s no reason to resize the height of the google maps widget on smaller screens but you just need to resize the width. It’s an iframe which can display the content based on the current resolution without distorting it. On the other hand the slider must scale the proportions based on the image size otherwise the images would look distorted. Most users to not use the google maps widget side by side with a slideshow and thus there’s no need for them to change the height of the maps widget manually based on the height of the other column. This is not an issue with the responsive layout because the google maps widget will fit into the responsive columns just fine and won’t look distorted or cropped. Changing the height based on the original “aspect ratio” of the map is imo not necessary for most use cases. If more users request this feature we’ll maybe include some media queries but you’re the first one…

    Best regards,
    Peter

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.