How to change default color of page 1 button
Also tell me codes for hover and background grey color.
How to change default color of page 1 button
Also tell me codes for hover and background grey color.
Hi There,
Please try adding this custom CSS under Theme Options > CSS:
body .x-pagination ul {
background-color: #f00f00;
}
body .x-pagination span.current {
background-color: #f0f0f0;
color: #f00f00;
}
body .x-pagination a:hover {
color: #000000;
}
If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.
I recommend you to watch following video that will help you to get started with CSS.
Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.
https://developers.google.com/web/tools/chrome-devtools/css/
Thanks.
@thai Hey thank you, I will try your code today and I am sure it will work. Can you please tell me one more thing. I know I should ask this from a developer and it is not a theme related question. Still I seek your help in this regard.
I am using renew theme and by default navbar color also changes the dropdown color in same way. Is there any way so i can change the drop down color in this way >>>
Also tell me how to get shadow like this image? Hope you will help me in this regard.
Hello Sansar,
To achieve what you want, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)
.site .masthead-stacked .x-navbar .desktop .sub-menu {
background-color: white !important;
box-shadow: 0px 0px 10px rgba(0,0,0,0.85);
}
Just replace the rgba() value with the rgba of the orange color that you want.
Hope this helps.
Hi @RueNel
Thank you. I inserted code in global CSS. I then cleared cache of browser. But nothing changed.
Hey Sansar,
To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.
Regards.
Hello Sansar,
Please have the code updated and use this instead:
.site .masthead .x-navbar .desktop .sub-menu {
background-color: white !important;
box-shadow: 0px 0px 10px rgba(0,0,0,0.85);
}
Please let us know if this works out for you.
Hi this is working ; but how can I change dropdown font color. Actually it was white so it is mixed with white dropdown background and disappeared.
If I change it from Header setting then navbar links and dropdown links both will be changed and it will look ugly. I want navbar links white and navbar dropdown link black.
Hello Sansar,
Please update the css code again and use this:
.site .masthead .x-navbar .desktop .sub-menu {
background-color: white !important;
box-shadow: 0px 0px 10px rgba(0,0,0,0.85);
}
.site .x-navbar .desktop .sub-menu li > a {
color: rgb(241,99,52);
}
.x-navbar .desktop .sub-menu li:before,
.x-navbar .desktop .sub-menu li:after {
background-color: rgb(241,99,52);
}
Hope this helps. Please let us know how it goes.
Hey thank you for your tremendous support. One last help I need from you.
@thai gave me following code to change color of pagination
body .x-pagination ul {
background-color: #f00f00;
}
body .x-pagination span.current {
background-color: #f0f0f0;
color: #f00f00;
}
body .x-pagination a:hover {
color: #000000;
}
It worked like charm.
But can you tell me how can I make page numbers darker? It is grey right now and almost invisible.
and if possible also give me code for that white circle color…so later if necessary, I can change that white circles colors like first page (1).
Hi again,
You can make use of the following code:
body .x-pagination a {
color: #000;
background-color: #cefaff; /* background color of the circle */
}
/* For hover color and hover background color */
body .x-pagination a:hover {
color: #000;
background-color: #7eccc9;
}
Hope this helps!
Thank you so much. These days I am facing
504 Gateway Time-out
nginx/1.15.7 error whenever I am trying to visit X>Theme Options
On the other hand, same command is working very well in other websites in same server and same theme.
Can you please explain this?
Hello Sansar,
Thanks for updating the thread.
Please take a look at solution mentioned in following thread.
Thanks.
Hi, Thank you for suggesting thread. Well, I know what is 504 gateway time-out error is. But amazingly this page is only appearing when I am trying to reach x>theme options
Otherwise all things are alright.
Hi Sansar,
Please do the following:
define( 'WP_MEMORY_LIMIT', '512M' );
define( 'WP_MAX_MEMORY_LIMIT', '512M' );
You can add it before the line:
/* That’s all, stop editing! Happy blogging. */
Let us know how it goes,
Cheers!
Thank you for all your support.
It was a plugin conflict so 504 page was coming.
One more problem I am facing now. I updated latest version of Wordpress and now some icons like tags, search icon, social icons etc. are not appearing in a proper way in all browsers (chrome, firefox etc)
My site url > https://www.sansarlochan.in/
I am attaching a screenshot
Can you tell me how to fix it
Hi There,
Upon checking your website, I could see this error message in the console log:
Access to font at 'https://p6k3i7q3.stackpathcdn.com/wp-content/themes/x/framework/fonts/font_awesome/fa-brands-400.woff' from origin 'https://www.sansarlochan.in' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
To fix this issue, please add the following code under .htaccess
file locates in the root directory of your FTP account:
Header set Access-Control-Allow-Origin "*"
Hope it helps
Hi ended Header set Access-Control-Allow-Origin "*"
in last line of htaccess but nothing worked
Hello Sansar,
Access to font at 'https://p6k3i7q3.stackpathcdn.com/wp-content/themes/x/framework/fonts/font_awesome/fa-brands-400.ttf' from origin 'https://www.sansarlochan.in' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Please check out this article for more information about this issue and how to resolve it.
Hope this helps. Please let us know how it goes.