I have updated the theme and when I go to a specific page to change the colors or other elements like icons on the customizer and using cornerstone, it gives me a window that I can’t click (I can’t add the screenshot in here). It also happens if I want to change fonts and font sizes. This happened even before the update and I was hoping it would be resolved but it’s not.
Hello There,
Thanks for writing in! To assist you better with this first issue, would you mind providing us the url of your site with login credentials so we can take a closer look? To do this, you can create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
For revolution slider, please check out this video to know how you can create an auto responsive slider:
I wanted to change the color of the font and make it a little bit darker in the home page (in the element with the greiysh background " how to use my Sardinia website", as the color of the writing is too light and difficult to read. But this is an issue across the customizer, when I go there to change colors, sizes/icons in an element/row I get this strange window. (By the way, there should be a way to post screenshots in here).
It’s because of <small></small> element, and it has its own styling overriding the style applied to headline element. And of course, headline element overrides what’s set in theme options. Hence, you’ll need another styling like this with your preferred color,
Like the way how you applied color to <strong> elements, adding opacity also make sure the black will appear black instead of gray.
As for the map, they are responsive on my end. Or are you referring to the spaces? That’s because you added big padding within those sections, and fixed padding aren’t responsive. Try percentage padding instead.
Or, don’t use padding at all. Instead, use max-width, example, you can add this to your section’s Inline CSS input field.
I’m not tech savvy so it is difficult for me to understand.
I took the template from one of the one available with X and customized it so I didn’t touch any code (it’s the Gym template)
Did you notice how in the customizer I can’t change anything? Is that because the template I have used interfere with the global settings? As It’s not even working to change the top bar color. I can’t really use the customizer for these things, there is the option to change color etc, i click on it and I have this pop up box with the colors but it’s not clickable and looks like it’s not working because it’s oriented in a weird way, I wish I could share the screenshot, is there a way to show you what I mean?
The maps (images) on my mobile look very small, can you provide a screenshot?
I’m a bit frustrated as I can’t change any color I want via customizer and I don’t know how to touch the code. It should be more intuitive for people who are relying on the customizer for these things, not being able to change anything in the code.
Can you help me somehow? I have no idea on how to put that code you told me and what the end result will be or how to revert to original in case I mess up.
The Gym template includes some custom CSS and that includes the colors of those text (see screenshot below). The text wrapped in a <small> tag is gray because it’s not totally opaque so you need to set the opacity to 0.5 or higher. You also need to change #ff551d to the valid color values. Here’s a list. Regretfully, you will need to work on CSS. The good thing about this approach is, you only need to setup once.
Regarding the map, I don’t see them in the page anymore. Did you delete them?
Is there a way to enable the attachment of an image in here? I might be able to get around that CSS but the other issues (especially the fact that I can not change the colors in the customizer is very annoying and it doesn’t depend on the CSS and no one told me what I should do to fix it. I need to show you the image. I can’t change any color, from the logo to the top bar background and font, and many other things.
Also for the maps, I don’t know where did you look as they are still there, without giving you a screenshot it’s impossible to tell you what we are talking about.
Please make sure that your screenshot is a *.jpg or *.png file. When you reply, find the upload icon for you to be able to upload the attachment image.
We’ll be standing by for your screenshot to resolve your issues.
Thanks! I didn’t notice the upload sign! The following is the main issue, I get this weird box when I want to change colors and other things in the customizer. If you notice, the top bar is blue and the text is barely readable so that I had to remove it because it was useless and I couldn’t change it. Same goes for many other elements: The color of the written logo (now i have an image), some icons… How can I fix this? It seems to be an issue of the theme.
And this is the screenshot for the non optimized images on mobile for the “maps”… they stay small and don’t take the whole width as the rest of the images on the website
Sorry which issue are we talking about in here?
The images non mobile optimized?
What about the main issue in the first screenshot? What is that? Why is it not working as it’s a functionality of cornerstone? So far it looks like everyone is ignoring that question. Which is the most annoying thing and have to be fixed asap. Thanks!
Yes, and that CSS will it bigger and full-width on mobile.
About the screenshot, it looks like specific to your device and browser. I can’t reproduce that issue on my end. I tried Mac and Windows 10, chrome and safari. Please try it on another device.
So, I used another device and for the color window issue, super weird but on that other laptop it doesn’t have the issue. I cleared all the possible cache on my Mac but still doesn’t work. Do you have any suggestion? I can’t buy another laptop just because of this There must be a reason and I can’t think of any other than what I already did.
Second issue: I think I didn’t explain myself… I don’t mind the Orange color, I like it actually and decided to leave it. The grey headers also don’t bother me.
What bothers me is that on that specific background the TEXT color is way too light and barely readable. see the image:
So I tried to change the global CSS as you said and I did a mess as part of the header disappeared and the orange was obviously gone, which is not what I wanted. As I said, that header and color accent is ok.
The last issue: The images not optimized for mobile. I added the code on the CSS of the element, refreshed and cleared the caches and nope, I still see it small. I also checked on 3 different mobiles…
Can you please help me with:
Giving me some suggestions of things I can try on my Mac to solve the issue of that weird window? (I’m asking my IT friends too but still not solved)
Tell me how can I change the color of the text in that section to a darker one, the header (orange and Grey are ok)
Double check the CSS I put for the images that won’t optimize for mobile. Maybe I put the code incorrectly?
Via my father laptop I was able to change the color of the top bar to a dark grey, but I realized that I can’t change the color of the text/icons (which don’t stand out right now), and I would also like to add some links in there. Where should I go to change these settings? (same with the footer, I think they are related as when I changed the top bar to dark grey, the footer color also changed automatically)
Thanks a lot for your help, I’m trying to do ALL by myself and it’s super difficult for me, given that being a CSS/HTML IT expert is not my job and I have already paid a developer for my first site and now I want to learn a bit but it’s so complicated!)
First, learning HTML and CSS is not at all difficult, provided you are using right tools and materials to get started. It’s human nature that we tend to prefer visual content over text based content to learn something new. I am sharing a fabulous resource that you can use to get started with learning HTML and CSS. How about you take 30 day coding challenge and devote 1 hour daily to learn HTML and CSS? You can cake Sunday a off day to enjoy weekend . It’s proven that if you do something for 30 days consistently the same become a habit. So I would highly encourage you to take 30 day HTML and CSS learning challenge. Also you can create a blog on WordPress.com and share your story of learning HTML and CSS and update the blog daily. It’s also proven fact that more you write, pace of learning increases astronomically. Please take this free course on Khan Academy (it’s free of cost).
I use MacBook and I am also not able to replicate the color box problem you are facing. Please see this screencast. I added few test elements on your website pages (no I didn’t saved the changes). Can you please make sure you are running up to date version of browser? https://cloudup.com/cvUZjG73eih
To change the content color, you need to open individual list item and then select the color under TITLE & CONTENT COLORS. Here is a screencast video to help you get started. https://cloudup.com/cyRJnL_aiJl
You can change the list item icon color by opening the individual list item and then selecting the color under GRAPHIC COLOR & BACKGROUND COLOR. Here is a screencast video. https://cloudup.com/cMTTLDKHDfv
So… I had to laugh at your suggestion to learn CSS and HTML (not laughing at you of course) but I’m struggling as I am to manage 2 websites all by myself and I wish I had the time to take even 1 hour out during the weekends Let alone start to learn CSS & co (I’d love to, but I have to study other things to run a successful website first). I will keep the link for when I will finally have some time left.
Ok, so for the other things
I knew how to change the colors etc, my issue is that the tab with the colors wouldn’t open in chrome. I am now 100% sure that I have an issue with Chrome. Also for other things it simply won’t work while on other browsers it does (I was FINALLY able to change the color of that text I was talking about using Safari)
The footer an top bar… I can change the background ok, but I can’t find a way to change the text/icon colors… look how difficult it is to read and see them now (the first image is the top bar, and whatever color I choose, the icon seem to follow a pattern to be a shade lighter than the background, hence not easy to read. I want to be able to change this setting somehow. Can you tell me where I should look?
The footer, the dark grey is the color I have chosen for the top bar. The upper part is where I can insert the widgets but I can’t change the background color (or I dont know where to do so), whatever I put in these 3 parts of the footer, links, forms…whatever… it’s not visible unless you hover on a link.
It’s weird as I thought the widgetised areas were part of the footer and would have the same color? But they seem to be 2 different elements with different rules.
What about the images that won’t be optimized for mobile? I doubt is a chrome issue in there and I tried several devices and I still see them super small. I added the code and all but to no avail.
Sorry, I know I should learn all this, and I am trying to see as many tutorials as possible but when I hit a dead end (and don’t have time to do anything else) I hope that you can give me some quick indications and pieces of code. I don’t need much, only to fix these top bar/footer thing and to optimize those images (or understand why I can’t see them optimized).
Oh one last thing. Super weird. Now when I write some text and want to make it bold, until yesterday it was ok. Now it looks almost like the normal text. I didn’t touch any settings for the typography so I’m a bit confused… look at this, it should be bold text but looks only slightly darker than the rest. I’m puzzled, yesterday it was clearly bold.
Thanks a lot for your help. At least I can now see the text on that element in the home page, it’s a start
That is actually an OS issue, I have seen that issue before (here) and it was solved when the user updates his OS to High Sierra. We like to help you on this, but that is an OS bug and there is nothing we can do about it but to advise to update your OS (no don’t buy a new laptop).
I like to provide you a custom CSS for that, but at the same time I don’t want to complicate things for you in the future. So my I advise would be, if you have access to other laptop/computer please edit your page in there, and change the Feature Box color with its native option CONTENT COLORS
If there is no other option but to use custom CSS.
Please add a CLASS feature-box-content-styling to your feature box element and add this to Theme Options > CSS
/*feature box text content styling*/
.x-feature-box.feature-box-content-styling .x-feature-box-content .x-feature-box-text {
color: red !important;
}
Images on x are natural responsive (unless you defined a width in it), that issue was not really on the image, but on the huge padding you applied on the section.
Let’s reset that unnecessary padding when the page switch to mobile view. Please add this to Theme Options > CSS
. It’s proven that if you do something for 30 days consistently the same become a habit. So I would highly encourage you to take 30 day HTML and CSS learning challenge. Also you can create a blog on 
