Community @ The Turning Gate

Support community for TTG plugins and products.

NOTICE

The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.

This forum is now closed, and exists here as a read-only archive.

  • New user registrations are disabled.
  • Users cannot create new topics.
  • Users cannot reply to existing topics.

You are not logged in.

#1 2015-03-11 04:16:08

pideja
Member
From: Montreal
Registered: 2013-02-26
Posts: 1,299

CE3 site revamped in CE4 / controling display of an image

I built this site last year (lucnadeau.ca in CE3 and now I'm reworking it in CE4. Since this will now be a bilingual site, I decided to create a sort of portal page to direct viewers to either language. I built this page in AutoIndex.
Would I have been better off with Pages?
Anyway, the layout is simply an image with a logo on it and the two navigational links over it. For the moment, I do not display the block and use the grid to display the single jpeg image. However, I'm having a hard time finding the right size so it won't be to small on the computer monitor (I use a 1920 x 1080) and yet not be too big on the tablet. The iPhone does not seem to pose a problem. You can see my test page here :http://pideja.ca/nadeautest
Do you think I could use a CSS sheet to control this image, similar to the technique used for "Dynamic Masthead" ? Or use a variant of the "Add a Background-image" script?

Offline

#2 2015-03-11 07:30:12

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 17,830
Website

Re: CE3 site revamped in CE4 / controling display of an image

an idea to try

In LR, set the image to the size you need for desktop
in custom css create a media query (or queries) to kick in for the ipad at either (or both) 1024px or ~786 px (whatever the vertical pixel width is)
in the media query limit the max-width of the grid to the width you want the image to be (I'm not counting any padding or margins, so take that into account).
You might need to set the image width to 100% too.

To limit the custom css to this page only you'll probably need to use phplugins to target this specific page with its own custom css file. Or just use the phplugins file that the export for this page generated rather than the global phplugins file.

there may be a more elegant way. This is just off the top of my head (and doesn't involve needing to create multiple images)


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site

Offline

Board footer

Powered by FluxBB