Hey Helgi!
Please add following code to Quick CSS in Enfold theme options under Styling tab
.image-overlay.overlay-type-extern .image-overlay-inside:before {
content: 'read more'; font-size: 16px; }
.image-overlay .image-overlay-inside:before { border-radius: 0; }
Best regards,
Yigit
Looks like issue is solved to some extend but now 2-3 alphabet are getting copped, How abt we reduce the font size on such screens?
Hi Shandhamankar!
Please try adding following code to Quick CSS
@media only screen and (max-width: 480px) { .av-special-heading { width: 115%; overflow: visible; left: -50px; } .av-special-heading-h2 h2 { font-size: 30px; }}
Cheers!
Yigit
-
This reply was modified 12 years, 6 months ago by
Yigit.
This reply has been marked as private.
Ismael, Ismael, Ismael, Ismael!!! That worked!
Adding the custom code to the custom.css file directly on my server did the trick!
The code that DUDE gave me was what worked :
html[lang="fr-FR"] p{
font-size: 14px;
}
Thank you Josue, Dude, and Ismael for all your help!!
Love you guys.
-Pat
Hey miguelinho84!
Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as desired
#top .main_menu .menu li a { font-size: 18px; color: red; background-color: blue; }
#top .main_menu .menu li a:hover { background-color: blue; color: red; }
Cheers!
Yigit
Hello !
I’d like to change the size, the font, the color, and the hover effect of my menu item, someone can help me and give me quick css please ?
thanks :)
Hi DoGrinDigital!
1, Try adding this code to the Quick CSS:
.logo, .logo img {
width: 450px;
height: auto;
}
2. By ‘Order Button’ you mean the ‘checkout’ link on your menu? that could be changed with this:
#menu-item-2659 a {
color: #F00;
font-weight: bold;
}
3. I guess you mean changing the main section font size, this may work for you:
#main * {
font-size: 16px;
}
4. You want to remove the title elements from this? http://copperadvantage.com/feed/
Regards,
Josue
Hello Support Team,
I have a question concerning the social icons. I have managed to add a dotted divider to the top right corner of the homepage. The social icons however do not seem to appear next to the dotted line (small fixed header with social Icons).
If I change the header options to non Fixed Header with Social icons, I can see the icons and they go to the center when the window size changes (just like on your site).
What do I have to change to I can see the social icons on the top right corner (small fixed header with social icons)? Here is my style.css code:
/*header with social icons - change how large the height can be */
.social_header #header_main .container, .social_header .main_menu ul:first-child > li a { height: 80px; line-height: 80px; }
/* changes social hover from circle to rounded square */
#header_main .social_bookmarks li a {
border-radius: 3px;
font-size: 16px;
}
/* moves the main nav left and changes right border */
#top .main_menu {
right: 100px;
border-right-style: dashed;
border-right-width: 1px;
padding-right: 25px;
}
/* moves the social nav to the right of main nav */
#header_main .social_bookmarks {
position: absolute;
top: 50%;
margin-top: -15px;
right: 0px;
}
/* hides the normal social div at the top */
#header_meta {
display: none;
}
/* removes border */
.responsive #header_meta .social_bookmarks li {
border-style: none;
}
/* removes border */
.responsive #top #header_meta .social_bookmarks li:last-child a {
border-style: none;
}
/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */
@media only screen and (min-width: 768px) {
/* Add your Desktop Styles here */
/* removes padding at the top behind logo after I shrink the main logo/navigation div height */
.fixed_header.social_header #main {
padding-top: 81px;
}
}
/* Smaller than standard 960 (devices and browsers) (ipad Portrait)*/
@media only screen and (max-width: 989px) {
/* adds the HKUSCG as a background */
div .logo {
background: url(https://www.hkuscg.com/wp-content/uploads/2013/10/S3transparentbackground-e1382792986200.png) top left no-repeat;
top: 11px;
}
/* makes the default logo transparent */
.logo img {
opacity: 0;
filter: alpha(opacity=0); /* For IE8 and earlier */
}
}
/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */
@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */
/*gives more space below main blog name when it is long and wraps to two lines on phones*/
.title_container .main-title {
line-height: 1.5em;
}
/* moves the icon logo on smaller screens */
.responsive .mobile_slide_out .logo {
margin-top: 10px;
margin-bottom: -10px;
}
/* moves socket nav away from top link */
#socket .sub_menu_socket div {
float: right;
margin-right: 60px;
}
/* change social icons */
#top .social_bookmarks li a {
font-size: 19px;
width: 40px;
}
}
I would like to thank you in advance.
Regards,
Frank.
Here is the code in template-builder.php:
echo ‘</div><!–end builder template–>’;
echo'<div style=”width: 100%; position: relative;”><div style=”color: #FFF; background-color: #AFAFAF; font-weight: 600; letter-spacing: 3px;
z-index: 1; padding-left: 30%; font-size: 1.3em;padding: 8px 1em;text-align: center;”>как нас найти – Санкт-Петербург, набережная реки Мойки 101</div></div>’;
echo do_shortcode(‘[wpgmza id=”1″]’);
echo ‘</div><!– close default .container_wrap element –>’;
P.S.
[wpgmza id=”1″] = map shortcode
Hi guys
Despite uploading a 1600px image to the Ajax Portfolio Gallery the actual is one that is only 1030 x 510px on the lightbox preview.
See here: http://www.swarez.co.uk/original-art-for-sale/
click the very first painting (When One Door Opens) and the very first image should be displayed at 1600 x 793px (when clicked to open in Lightbox) but the default setting is choosing all images to be displayed at 1030 x 510px.
I need to be able to display the original image size on the preview sliders. Can you point me to the place I can make this change please?
Big thanks as always.
Ed
PS – since 2.4.1 my buttons have black writing in them. Did a CSS change to #ffffff but this changed the white buttons to a white font! Ouch! Any help for that one too please. Thanks.
-
This topic was modified 12 years, 6 months ago by
Swarez.
Website is: http://copperadvantage.com/home-v7-one-page-portfolio/
Questions:
1) How do I scale up header tool-bar font size, scale up logo?
2) Change Order button to different color and bold to make stand out?
3) Change font size throughout the theme?
4) Is there a way to hide the RSS feed titles? It says optional but when I don’t place a title it defaults to the title of the site.
Thanks in advance
Hi saundra!
If you want to make the font larger please use this on your custom.css or Quick CSS:
body, body p {
font-size: 15px;
}
You can select fonts on Enfold > Styling > Heading fonts and Body fonts.
Regards,
Ismael
Hey!
Please use this:
.main_color input[type='submit'] {
background-color: #c05f5f;
color: #ffffff;
border-color: #a03d3d;
border-radius: 3px;
background-image: url("../images/layout/bg-button.png");
background-repeat: repeat-x;
background-position: 0 0;
padding: 10px;
font-size: 12px;
text-decoration: none;
display: inline-block;
border-style: solid;
border-width: 1px;
margin: 3px 0;
line-height: 1.2em;
position: relative;
font-weight: 600;
text-align: center;
max-width: 100%;
}
.avia_ajax_form .button {
margin: 0;
padding: 16px 50px;
border-radius: 2px;
border-bottom-width: 1px;
border-bottom-style: solid;
font-weight: normal;
font-size: 12px;
}
input[type="submit"], #submit, .button {
padding: 9px 22px;
cursor: pointer;
border: none;
-webkit-appearance: none;
}
Adjust the values if you want.
Cheers!
Ismael
Hello Dude! Thanks for your help. The first code example didn’t work.
For the second one :
body.fr_FR p{
font-size: 14px;
}
. . . where in the functions.php folder should I place this? :
<?php
add_filter('body_class', 'append_language_class');
function append_language_class($classes){
$classes[] = ICL_LANGUAGE_CODE; //or however you want to name your class based on the language code
return $classes;
}
?>
Thank you.
Hi!
Please add following code as well
.title_container .main-title { font-size: 18px; }
.title_container .main-title a { color: red; }
Best regards,
Yigit
i also need to be able to change the color and sizeof the page title
Is there an easy css you could give me to increase the font size (overall) for this theme. It’s sooooo tiny. Please? This would be for typical (paragraph) font.
Also, do you have a font that is uploaded that is close to what Apple uses or Pinterest? Just talking about the style.
New to the theme, still working through but it’s lovely. Thank you.
Hi!
You can try following code instead
html[lang="fr-FR"] p{
font-size: 14px;
}
If it still doesn’t work you can use the code from here: http://wpml.org/forums/topic/body-class-based-on-language/#post-18785 (insert it into the functions.php theme file) to add the language shortcode to the body classes. Afterwards you shoud be able to style your website with
body.fr_FR p{
font-size: 14px;
}
Regards,
Peter
Hey midischool!
Can you please post a screenshot of the button that you want? You can style the submit button using this selector on Quick CSS:
.main_color input[type='submit'] {
background-color: #c05f5f;
color: #ffffff;
border-color: #a03d3d;
}
.avia_ajax_form .button {
margin: 0;
padding: 16px 50px;
border-radius: 2px;
border-bottom-width: 1px;
border-bottom-style: solid;
font-weight: normal;
font-size: 12px;
}
input[type="submit"], #submit, .button {
padding: 9px 22px;
cursor: pointer;
border: none;
-webkit-appearance: none;
border-radius: 0px;
}
Cheers!
Ismael
Hey corly!
Write it in plain HTML, assign it a class:
<h2 class="smaller-heading">My h2 heading</h2>
Then add this rule to the Quick CSS:
.smaller-heading{ font-size:14px !important; }
Cheers!
Josue
Hey Pat!
I meant that you can add that prefix to any CSS rule and that will only be applied to the french version of the site.
Example:
html[lang='fr'] p{
font-size: 14px;
}
html[lang='fr'] h2{
color:red;
}
Regards,
Josue
Hi!
Please add following code to Quick CSS as well to increase main menu font size
.main_menu ul:first-child > li > a { font-size: 16px; }
and for breadcrumb non-active elements
.alternate_color .breadcrumb a { color: red; }
Regards,
Yigit
Hi, how can I change a H4 heading to H2 without making the font size bigger (for SEO)?
Also whats the code to adjust the menu font size
I see where it changed on the right but not on the left side
Hey!
Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as desired
.main_menu ul:first-child > li > a { font-size: 16px!important; }
Best regards,
Yigit
Hey jdthedj!
Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as desired
.title_container .breadcrumb { font-size: 15px; color: red!important; }
Cheers!
Yigit
Hi!
looks fine for me, both in windows and mac. No strange fonts, no nudging. Since I can’t see the issue I cant really offer any more assistance, the last thing I can think of is to apply a css rule that we used in an eariler version of enfold to fix similar problems, maybe it also fixes this one:
.avia_textblock,
.avia-icon-list,
.avia-button,
.avia-testimonial,
.iconbox,
.avia_message_box,
.avia-team-member,
.widget,
.post,
.team-img-container img,
.team-social,
.iconlist_icon,
.fallback-post-type-icon,
.fullsize .related_posts,
.grid-image,
.avia-caption-content, .avia-caption-title,
.entry-content-wrapper,
.avia_start_animation
{
-webkit-perspective: 1000;
-webkit-backface-visibility: hidden;
}
let me know if that helps. its a shot in the dark based on experience but not sure what else I can do if I can’t see the issue anymore :/
Regards,
Kriesi