Home › Forums › Weaver Xtreme Theme › Create a clickable front page image
- This topic has 6 replies, 2 voices, and was last updated 6 months ago by
scrambler.
-
AuthorPosts
-
June 26, 2020 at 15:32 UTC - Views: 33 #64718
nstratman
ParticipantIs there a standard way in Xtreme I can create a single full screen front page image which is clickable anywhere? That front page will then link to the home page of a site in development. My only effort so far is to create a draft page, use the Xtreme per page options to omit pretty much everything then set the featured image as the background image. It looks just as I want but I can’t see how to add a url to the image to link to the home page.
Thank you.
June 26, 2020 at 15:49 UTC - Views: 32 #64719scrambler
ModeratorI assume you meant using the raw page template.
For the link, you could probably create a small transparent (.png) image, then add that image in the page with a link and a 100% 100% size using 100vw and 100vh (Viewer width and height CSS) (see below)
June 26, 2020 at 16:13 UTC - Views: 31 #64720scrambler
ModeratorThe html for the transparent image link would look like
<a href="LinkUrl" ><img src="ImageUrl" style="width:100vw;height:100vh;" /></a>
June 27, 2020 at 12:16 UTC - Views: 29 #64724nstratman
ParticipantThanks for this. Armed with your code I was able to achieve what I wanted without needing to use the transparent png. Using the raw template (I hadn’t done this, I was using my normal template and using per page to omit everything). Then instead of the featured image I put a SiteOrigin html widget on the page and added your code using the required full screen image as my source and linking to the home page. It works just as I hoped so thank you.
By the way, this front page is for the site about which I asked for your advice and we had a brief discussion about the merits of subdomains and subfolders. At the same time I was experimenting with the per page options in Xtreme. I found that I could achieve what I wanted by switching off much of the main site layout and using 1 or 2 per page layout widgets. There aren’t many pages in the site and half of those are similar. So I set up my per page options and cloned the page a few times to get me started.I mention all of this because I have strong reasons to be very grateful for the extensive per page options and overall flexibility of Xtreme.
July 18, 2020 at 12:42 UTC - Views: 15 #64846nstratman
ParticipantHaving said it works fine, it doesn’t respond properly in portrait mode on a phone. Admittedly the image is very much a landscape design, but the vertical dimension is not scaling leading to a squashed image.
Furthermore now that I have added cookie consent to the page using one of the standard plugins, the consent statement works fine for the first time visit, but the statement also shows up when you scroll the page. Do they all work like that?
This is the html, inserted as described in the earlier post above into the front page, to allow then a click into the home page.
July 18, 2020 at 13:48 UTC - Views: 16 #64847nstratman
ParticipantJuly 18, 2020 at 16:30 UTC - Views: 10 #64848scrambler
ModeratorTo post code, you need to give it the preformatted style from the tool bar.
That said I am not following what you are saying.
I see your landscape image and if I reduce the browser size to any format portrait or landscape, the image is there at the top undistorted.
As for your cookie consent it does not seem to work, the ACCEPT is not clickable and the close button does nothing.
Using the browser development tool console I see the error below
(index):108 Uncaught ReferenceError: jQuery is not defined
at (index):108Which may explain why it is broken
-
AuthorPosts
- You must be logged in to reply to this topic.