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.
You are not logged in.
Pages: 1
Hi there,
I had successfully implemented dynamic mastheads in CE3, but the method used there can obviously not simply be copied across to CE4.
I have Custom CSS enabled and this works (red-background test), but copying the old CSS code and the related images for dynamic mastheads as described here: http://ce3wiki.theturninggate.net/doku. … _mastheads does not do the job in CE4.
Any suggestion how to do this or where to read further?
Alfred
Offline
see this from the phplugins section of the docs:
http://ce4.theturninggate.net/docs/doku … pect_ratio
You could do something similar as was done in CE3, but you'll need to look at the new page structure and write the css accordingly.
But it looks like Matt has a tutorial planned. The title for it is there, but no link yet: http://ce4.theturninggate.net/docs/doku … bility_api
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Hi Rob,
thanks for this advice. What I have found through your first link helped me to achieve what I needed. I'll delay any further work untill the dynamic masthead tutorial is online. I needed to learn though that the option "Keep away from edge" for the identity plate needed to be unchecked. Thanks again for your support.
Alfred
Last edited by alfred (2014-08-02 10:24:13)
Offline
Any update or clarification about how to do this in ce4.
I found the ce3 doc and was just about to create a custom css and dynamic masthead in the phplugins per that article but checked here first.
Glad I did since I am now totally unsure about what to do.
What I am trying to accomplish is to have a 300 px graphic masthead/image (instead of my large on responding down) on the smallest viewport because otherwise there is a very big gap between the top of the page to the masthead, and the bottom of the masthead to the nav menu. Takes up a whole lot of real estate on the small screen.
if not so, or in the meantime, can I go into some css somewhere and simply change the image or add css to change the image that was and hide the large one.
Workaround or tutorial about how to do this. Thank you in advance:-)
Side Q: in general if I chage something in the css (only talking visual stuff, for example padding etc. can I do that without breaking the whole site if not using a custome css because I don't know how to integrate that idea and there are a few little css layouts I would like to modify. I understand that if/when I re-upload site files it will overwrite any mods/changes made.
Last edited by Em (2014-10-25 08:40:37)
Offline
Any update or clarification about how to do this in ce4.
funny you should ask: http://ttg-tips-and-tricks.barbeephoto. … heads-ce4/
Side Q: in general if I chage something in the css (only talking visual stuff, for example padding etc. can I do that without breaking the whole site if not using a custome css because I don't know how to integrate that idea and there are a few little css layouts I would like to modify. I understand that if/when I re-upload site files it will overwrite any mods/changes made.
Most of the css is set directly in the plug-in. Any custom css you add will be added to the head section of the page last and therefore take priority (unless you're not specific enough with your selectors)
In case you haven't seen it, here's how to set up for custom css:
http://ce4.theturninggate.net/docs/doku … custom_css
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Problem with Dynamic Mastheads on Smartphones (at lease my iPhone 6)
I have meticulously followed Matthew's tutorial for implementing dynamic mastheads (http://ce3wiki.theturninggate.net/doku. … _mastheads) and activated having enabled custom CSS and Rod's update for CE4 (http://ttg-tips-and-tricks.barbeephoto. … heads-ce4/) replacing "html .logo" with "html #masthead .mantle h1" but I am still losing the last letter on the right hand side of my title on my iPhone 6: www.summitphotographs.com
Everything else seems to be working fine on tablets and browsers.
Any thoughts where I can look for the solution?
Thank you.
Nick
PS I have only implemented the dynamic masthead so far in Pages, not in any of my galleries.
Offline
you might need to change up or add to the css. Since you're using the Integrated option there's probably different structure to work with, considering that the masthead is now in the navigation
Start by looking at the page source code and using your browser's inspector to see what css is being applied and where it's being applied.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Yep, the dynamic masthead tutorial and my CE4 update won't work for the Integrated Masthead.
In fact, none of your css is being applied.
You might be able to modify it though using this selector:
#nav #integrated-identity a, #nav #integrated-identity span(you may need to modify that)
rather than:
html #masthead .mantle h1you'll also probably need to make sure that the size of your png for the phones isn't larger than the space provided (width of browser/device minus the width of the menu icon and any padding and margin.
And since the background image will be applied to a span element, I think you'll also need to define its size too (height and width) in the css.
I think the easiest thing to do is to simply follow Matt's advice in the documentation and size your graphic, as he suggests, to maximum width of around 244px (yours is 310px)
http://ce4.theturninggate.net/docs/doku … integrated
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Rod, thank you. I do not know what we would do without your prompt and always helpful replies.
Because I want the Masthead, and indeed whole site, to be as minimalist as possible so that the photographs can speak for themselves, after playing around a bit I have followed your advice to follow Matt's advice and kept the integrated plate small. I started off with 244, but playing around with padding and font size, I seem to be able to get away with 280px wide although that has only so far been tested on Apple devices and 'phones.
Thank you once again for your invaluable help.
Nick
Offline
it looks good to me.
And so do those images. Wow.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
As a travel photographer, you put me to shame. I'll need to make a place for you in the showcase the next time I'm adding things. "Wow" is most definitely the word.
Offline
Matt and Rod, thank you for your kind words. Really appreciated.
We've recently moved house and been quite involved in the Nepal earthquake work so the website rebuild got put on hold and I'm just picking up the pieces again. There are a lot of galleries to go back online with some great pictures in. Hopefully now I'm on a roll they should start appearing over the next week or so.
Thank you for all your hardwork on the plugins and the amazing support you provide us. There are only so many hours in the day and I'm not as good with code and stuff as I would like to be so the support is priceless. Keep up the great work!
Nick
Offline
Offline
Pages: 1