Forum Replies Created
-
Posts
-
> Have you tried selecting standard screen sizes instead of manually adjusting the screen width or height?
What do you mean with that? Selecting where?BTW, your CSS is working very well, thanks Ismael. For me it’s always a mistery how you can understand so quickly what are the parts you need to modify :-)
I just had to add a small thing: the menu containing the search button and the burger was not vertically centered.
I had to add this one below, I am adding it for reference in case anyone else is reading this post. I cannot understand why it was working for you in the screenshot above…nav.main_menu { height: 100% !important; }Transparence is not there… but who cares.
Thanks Ismael very much!
Bye,
A.-Thank you so much, @Yigit. It works like a charm! Unfortunately, I was not aware of that option. Thanks again!
Thanks Ismael, but I don’t have the 1st CSS code in my style.css file… what do you mean when you say “This sets the header height to 90px on tablet view”? You mean “…in the standard CSS of the Enfold theme”?
My request is to have the same height of the header (50px) to all screen sizes, and always transparent on top (if possible)…
Anyhow: CSS #2 of your email is fixing between 768px and 989 onlypx, but it is not transparent.
At < 768px no changes, of course.
If I remove the “min-width: 768px” of your CSS, the header size is still 80x, and in addition to that, the Burger menu is not centered anymore: see hereHi Ygit, thanks for your help.
Here is the video.
Let me describe what you will see.
I added a CET to the first two PORTFOLIO pages. The CET is a “text component” that displays the word “CASA” (HOUSE in English).
I’ll show you the two pages, which display correctly in both languages.Then I edit the CET on the first page, change “CASA” to “LIBRO!”, and translate (with WPML) “LIBRO!” to “BOOK!”. As you can see, the first portfolio displays correctly in both languages (“LIBRO!” and “BOOK!”).
When I open the second portfolio, however, the Italian version displays “LIBRO!” correctly, while the English version still displays “HOUSE.”
From here, I make several attempts to translate “LIBRO!” in WPML.
In a previous attempt, I simply did an UPDATE on the page, and then WPML updated and showed me “LIBRO!” so that I could translate it. This time, however, nothing works. As you can see, it continues to show me “CASA” + “HOUSE”…Does it make more sense now?
Sure thing.
I’ve prepared a “test case” for you.
1) take the the first 2 “portoflio items” (see screenshot 1).
2) In the 1st portfolio, I’ve created a “Text block test 1” item, with a simple word, “CASA”, locked. I’ve added it to the same portfolio, and I’ve translated it to EN (HOUSE) and FR (MAISON). See screenshot 2).
3) I’ve added the “Text block test 1” also to the 2nd portfolio. Now the 2 pages are shown correctly, in IT, EN and FR.Now please try to change the “CASA” italian word another word (e.g. LIBRO) in the portfolio #1 (in the CET area, of course, opening the CET for editing), and translate it in WPML while being in Portoflio #1.
See screenshot 3.At this point, If you open the portfolio #2 page, you will correctly see “LIBRO” in the italian version of the page, but the EN and FR pages will still show the old translation (HOUSE, MAISON).
To update the EN and FR pages, you need to open portfolio #2 in edit, then “UPDATE IT” so that WPML notices that there is a change, and only at that moment you can open WPML translation editor and “validate” the translation.Thanks for you help, Ismael!
Unfortunately, it is not 100% compatible with WPML.
I created a CET component of type TEXT, with a simple word: CASA in Italian.
I translate it with WPML, HOUSE.
I add this CET to several pages: in all of them, you see CASA in the Italian version and HOUSE in the English version.If I now change the word to ‘LIBRO’ in the CET, the pages are showing LIBRO in the italian version, but HOUSE in the English version.
I have to open EVERY single page where that CET was used, do a blank ‘UPDATE’ (as it seems like WP is not detecting the change) and then update the English translation in WPML. For every single page.Too bad.
That is FANTASTIC. Thanks Ismael, it works as expected. I misunderstood the “Lock/unlock” feature.
Thanks again!I’m refreshing this old thread as I was trying to achieve the same result (ref: here)
@greenmarketers, if you edit the CET (e.g. by changing the label on a button), the change is not applied to CETs that have already been used on your pages.This is what @stuwetueho and I want to achieve: I create a special component and use it on different pages. Then, after editing that “special component”, the changes are applied everywhere that special component was used.
The CET seems to work almost exactly like the ‘Templates’: when you use them in a pages, they are not linked to the original CET/Template anymore. Any further change will not be propagated.
Thanks Ismael. Good suggestion to use a color section as a container to make it sticky!
Thanks again. Bye!(BTW: I realize only now that the fullwidth submenu can be created also using an EXISTING menu (see the option).
And now I understand why the fulldiwth submenu documentation is explaining how to add an icon by working on the MENU…I am not using this option: I used the Build Simple Custom Menu. And with this option, you cannot add icons like explained in the doc. It would be worth to specify it in the documentation…)
Ciao Ismael. I started using a fullwidth submenu also because it had an easy “sticky submenu” option available in the configuration.
I have struggled quite a lot with CSS magics to have it sticky also on mobile devices.Now that I am finally satisfied with the fullwidth submenu behaviour, I wanted to have an alternative and smallest version of it only for mobiles, with icons instead of text labels.
You’re suggesting to use the buttonrow instead of the fullwidth subemnu: I am ok with it… could you please and kindly also provide me the CSS to make it sticky, on all media formats?
I’ve already tried by myself but I failed…Thanks Ismael!
Bye,
A.-Sure! Here it is. The page where I was testing the icons was this one:
https://staging.sentierigressoney.it/sentieri/gressoney-saint-jean-sentiero-1-colle-di-frudiere/
Please switch from Italian (OK) to English (KO)…
Is it correct that the section in the document I mentioned is not talking about how to add an icon to a fullwidth submenu? Or it was my mistake to follow a different way?
Thanks Ismael!
Ciao,
A.-Thanks Ismael, it works perfectly. I dare to suggest that you should add a specific option in the configuration, I think it is quite normal to have the Logo vertically centered.
Bye!
A.-my bad.
I had ADDITIONAL “responsive settings” set on the controls included in the left and right cells… they were all simply set to hide when on mobile….
Sorry folks. You can delete the thread!
Thanks Ismael. I would like to understand why you cannot replicate it… but this last CSS did the job: now it is perfect, the page is not wobbling anymore!
Thanks again, nice job as usual.
Bye!
A.-Thanks Ismael.
I don’t see any change, adding this CSS: the page is still scrolling a little bit up or down if I am not perfectly swiping horizontally.
Are you able to reproduce the issue that I’ve shown in the screencast I’ve included in the last post?THX
Bye,
A.-Thanks Ismael for your help!
What mobile/broswer did you use when you tried to reproduce the issue?Anyhow: thanks for the hint, I’ve added the CSS, now it is better… but there is still an annoying side effect:
when you swipe, you’ll see that if you’re not swiping with your finger PERFECTLY horizontally, the screen still moves up and down a little bit, giving the… groggy experience you can see in the following screencast:It’s a Wetransfer video, the link will expire in 3 days: in case you read this message later, I will refresh the link.
Is there any magic CSS trick we can do to avoid ALSO this vertical movement during the swype?
Thanks as usual!
Bye,
A.-Oh, thanks Ismael. No, in fact everything worked fine, but I’ve never noticed it before, and I thought it was an issue.
You can close the ticket, thanks!
Bye,
A.-Hi Ismael, I’ve made further research. Luckily, it is not happening on ALL pages, ony a few.
To fix it, I realized that I must do this (I am explaining it for other people may have the same issue in the future):1) EDIT the page
2) open the version in the language that is opening the pictures in the wrong format
3) do a fake edit and then click on “Complete”. WPML apparently “refreshes” the translated page.Done. The page is now opening correctly.
It seems like it is something related to some failure in the WPML update.
Thanks for your help, you can close the ticket.
Bye!
A.-Hi Ismael, thanks for your answer: no, it is not an applicable solution for me: I have hundreds of images like that. I cannot edit them all…
See here: I’ve noticed that, in the staging environment, the English page is still opening the images in the correct size.
In the last days, I’ve worked a lot with WPML updating a lot of translations. It must be something related with the multiple updates with WPML that “broke” the image links. The staging area has been updated some weeks ago, before this activity.
I’ve added in the private area information about how to connect to the staging area.
Sure, I’ve used the one that changes it every time you open the page, exactly what I wanted. Thanks again!
OK, I’ve found it.
DO NOT USE PARENTHESIS IN YOUR FILE NAMES! :-)
Great job @Guenni007, as usual!
THX
Bye,
A.-…and I am sorry to say that it is not working for me as well :-(
Here is the code I’ve customized (the ID of my page is the one below, I’ve double checked it).
function randomize_bg_image() { if(is_page(11318)){ ?> <script type="text/javascript"> (function($){ var images = ['img(1).jpg','img(2).jpg','img(3).jpg','img(4).jpg','img(5).jpg','img(6).jpg','img(7).jpg','img(8).jpg']; $('#randomized').css({ 'background-image': 'url(/wp-content/uploads/sfondimobile/' + images[Math.floor(Math.random() * images.length)] + ')' }); })(jQuery); </script> <?php } } add_action( 'wp_footer', 'randomize_bg_image' );Images are here:
https://imgur.com/a/tu7Qy05
let me highlight that I’ve copied the images DIRECTLY TO THE FTP SITE, I did not use the Media Library… can this be the reason?#randomized is correctly set:
But when you open my website in mobile mode, the background is frozen to the original one:
https://www.sentierigressoney.it
@Guenni007, I hope you’ll find some time to give my some hints :)@antdesign01, I am refreshing this thread because I am trying to do the same, following the suggestion of the great @Guenni007.
I don’t know if you’ve been able to make it work at the end, I just wanted to highlight that you must also edit the following line:if(is_page(34024)){replacing 34024 with the ID of your page. To know the ID of your page, open it in the browser, view the source code and then look for “page-id” string. You will find the ID you must use.
