- This topic has 6 replies, 2 voices, and was last updated 10 years, 4 months ago by
.
-
Posts
-
Hey guys of Satori,
Im using your Awesome theme to create a website, but run into a problem.
I want to be able to place a google map all across the width of the screen.
I added a page, with the google iframe html code, changed the width, and saved the page as a Full-Width template page, Problem is it doesnt show it as a full page.Check out here: http://www.on-lijn.nl/stadsranden
If u click on Kaart Vollenhove you will see what i mean.
How do i fix this?
Kind regards,
Laurens Hoogland
on-lijn.nlHey Laurens,
first of all, thank you for the purchase!
In Kanso, the one-page template includes pages by displaying titles on the left and content on the right, the latter being about 60% of the container width; the “Full-width” page template is more suited for the classic multi-page usage version of the theme.
To make a Google map stretch full width of the screen, one would need to change the code of the “page_one-page.php” template file and create a new page template. This is normally considered a customization and not covered by the ThemeForest support offer, yet if you’d agree to give me some time, 1-2 days (and I’d also be grateful for rating the theme on your ThemeForest profile), I’d be able to come up with the custom files. This sounds like a decent addition to the theme’s functionality.
In case I’ve not replied by Tuesday morning, please reply to this thread to remind me ;)
Sincerely,
Andrii / Satori StudioHe Andrii,
First of all let me say: AWESOME!!!!
I will wait in anticipation on the files:))Secondly, Hell yeah i will give u a uber rating, and make sure my wordpress building friends will find their way too ur templates.
With many thanks and kind regards,
Laurens Hoogland
Hey Laurens,
please download the archive from my repository, unzip it, and upload the containing files into the theme root folder (/wp-content/themes/Kanso/), replacing the existing files when needed.
The new „Page: Google Map“ page layout displays a full-width interactive Google Maps interface, e.g. to use before the contacts page. In order to create a Google Maps page, add a new page and declare the page layout as „Page: Google Map“. Then go to Google Maps, find the location you need and press on the little cog icon in the bottom right corner of the screen; in the pop-up window, click on the “Embed map” tab, copy the link (it should begin with „<iframe“) and paste it into the content of the page. Update/save the page and do not forget to include it into the one-page display in the "One-Page Website" tab of the theme options panel.
Please let me know if it works as intended.
Best,
Andrii / Satori StudioOkay, this works perfect, except for a couple of things,
1. I wanne be able to add this page where ever and when ever, without it interferring with the main menu on top.
If i add the page template now, it gets removed from the Menu, and that is something i cant use.
Since my page will hold 2 diffrent Google Maps and people have to be able to menu-click their way to it.2. Is there a simple way of making the maps unscrollable? i made a iframe class and managed to disable scrolling in ff and ie but somehow chrome wont react to this class css code.
Hopefully there is some workaround:)
Cheers,
Laurens Hoogland
Another Issue, and tell me if i should make a new forum post for this, is the following:
I would like to change the anchor point so that when i click in the menu on one of the links, the paralex effect sets it right where the page starts, now it goes a little over the page.is there a way to set these points? I tried playing with page-delimiter, but that doesnt change much for the better:P
Hopefully u understand what i mean,
In anticipation i await ur future post.
Kind regards,
Laurens Hoogland
Hey Laurens,
1). Here’s the custom file which does include the maps sections into the menu (I’ve excluded them on purpose previously). Again, simply unzip the archive and upload the contained file into the theme folder.
2). This is a trickier one; the only “quick” way I can think of is to force the maps to behave like this in all browsers would be to add an extra transparent div layer above them (i.e. the maps would be “behind the glass” and not affected by the scrolling), yet in this case one will also not be able to interact with the map in any other way. The more “natural” way would be to use Google Maps API to embed the map, yet this requires knowledge of Javascript and other languages; I cannot do it remotely for you because to use the API each website must create a unique API key that will be used for embedding the maps on that particular website. If you still want to go for it, you could try creating the key in the “Obtaining an API Key” section of the API manual and send it to me via email to support@satoristudio.net, I might be able to help with the rest.
3). Regarding your last question: please provide a specific example with a link – that way I will be able to see the code and give you a more substantial piece of advise.
Best,
Andrii / Satori Studio
- You must be logged in to reply to this topic.