-
Search Results
-
In reply to: Colour & Font Size Changes
Hi,
This is the url of the About Us section of the demo http://kriesi.at/themes/enfold/pages/about-us/ … There are no icons here , but I am guessing thumbnail photos – like when you run the mouse over harrold houdini’s photo?
I got this css exactly the same way as shown on the above video using chrome developer tools
/*---these are the colors when mouse hovers--*/
#top .avia-team-member .twitter:hover {
color: rgb(70, 212, 254);
}
#top .avia-team-member .dribbble:hover {
color: rgb(228, 72, 133);
}
/*---this is the regular color of the icon inside circle--*/
#top .main_color .team-social a
color: grey;
}
/*---this is complete settings controlling size, shape, background color, position of the circle itself--*/
#top .team-social a {
text-decoration: none;
position: relative;
border-radius: 30px;
padding: 0 16px;
background: rgb(224, 17, 17);
margin: 3px;
display: inline-block;
height: 53px;
line-height: 54px;
width: 53px;
}Keep playing with developer tools, i know at first it seems oppressive, but there is nothing better than this to use to quickly be able to edit css of any site.
Thanks,
Nick
In reply to: Colour & Font Size Changes
Hi Nick,
thats great and I think when we talk basic changes like H1 text, logo heights etc… the way you mention seems relatively straight forward for a novice. Where Ive become continuously unstuck are things like the discs (behind the icons) if I want them a different colour or size, or to change things that have (what i call) nested button states – the drop down menu for instance as I want to change the colours of the ‘drop down’ background but because there are several states (off, rollover and sometime on) I cant quite find the right piece of code using the method you mention. I also want to alter the (moving) thin underline when you rollover the top nav so that I remove the middle ‘tick’ mark and increase the thickness slightly but again I can’t see where the correct code is amid a sea of other comments. This im sure is my inexperience but any clue as to how to deal with such things would be warmly received
Cheers
all the best
Andy
In reply to: Colour & Font Size Changes
Hi,
Your best bet is to instal Chrome Developer Tools and without needing to know CSS you can manipulate the elements easily. I just made a video https://docs.google.com/file/d/0B8hqGBMSfHtKd2l6UkcwUjVBVWM/edit?usp=sharing showing how easy it is to change the menu any way you want , copy and paste to quick css in the theme backend. This is the best tool for editing without the learning curve.
Thanks,
Nick
In reply to: buttion problem in ie8
thanks and I found the min-width shall be made to the code below, but how can I add such change to the quick CSS?
.avia-button.avia-size-small{
padding:7px 10px;
font-size: 13px;
min-width: 120px;
}
.avia-button.avia-size-medium{
padding:10px 0px;
font-size: 14px;
min-width: 90px;
}
.avia-button.avia-size-large{
padding: 13px 30px;
font-size: 14px;
min-width: 127px;
Topic: Colour & Font Size Changes
Hi there,
Trying to change a few things as im creating a dark theme with a chocolate background with dark red buttons, labels & icons. Ive looked through the layout CSS file and cant seem to change/find what I need
1) The font sizes throughout – in particular the H1 tags and the main menu fonts. I want to use much bigger font sizes. When I try to change the menu in the layout CSS file nothing happens which I presume is because of responsive control settings
2) Changing the drop down nav background to red with black/white text and also a lighter rollover background version
3) The circular disc backgrounds (as used in the demo ‘About Us’ section) id like to change the disc background to the mentioned red colour
Cheers
In reply to: Mobile Fixed Header
Here was my css code:
.main_menu ul:first-child > li > a {
font-size: 152px;
}
#header {
position: fixed;
}
I removed the top code and the site renders, but the bottom code cuts off about an inch of each page.
In reply to: Mobile Fixed Header
OK, Thanks that helped.
Can you advise of the best way to increase the size of the phone # ?
Right now I’m using <font size=”4″>xxx-xxx-xxx
It doesn’t work well on all browsers,
Thanks
Hi,
Try this on your Quick CSS or custom.css
.menu-item a {
font-size: 20px!important;
}Regards,
Ismael
In reply to: Changing the 'Icon List' icon size animation
Hi,
You can make it smaller with this code
.avia-icon-list .iconlist_icon{height:64px; width:64px; line-height: 60px; font-size: 30px; text-align: center; border-radius: 500px; position: relative; float:left; margin-right:30px; margin-left:2px; z-index: 5; border-style:solid; border-width:2px; color:#fff;}Change the values of height, width, line-height and font-size properties. Something like this.
.avia-icon-list .iconlist_icon{height:50px; width:50px; line-height: 50px; font-size: 20px; text-align: center; border-radius: 500px; position: relative; float:left; margin-right:30px; margin-left:2px; z-index: 5; border-style:solid; border-width:2px; color:#fff;}Regards,
Ismael
In reply to: Hover Overlay
Hi,
1.) Edit css > base.css and find this code.
.image-overlay .image-overlay-inside::before{content:"E744"; font-family: 'entypo-fontello'; font-size: 18px; font-weight: normal; }
.image-overlay.overlay-type-extern .image-overlay-inside::before{content:"27A6";}
.image-overlay.overlay-type-video .image-overlay-inside::before{content:"25B6";}You can change it to something like this.
.image-overlay .image-overlay-inside::before{content:"E744"; font-family: 'entypo-fontello'; font-size: 18px; font-weight: normal; }
.image-overlay.overlay-type-extern .image-overlay-inside::before{content:"E723";}
.image-overlay.overlay-type-video .image-overlay-inside::before{content:"E723";}Change the “content” property using Entypo. Refer to this link. http://www.entypo.com/characters/
Regards,
Ismael
Hi,
Yes, you can style a specific category page but only the overview page of a certain category not the single view of the products included on that category. On the category overview page all you can change is the title of the products and the add to cart button text. For example you have a category named jewelry. You can add something like this on your custom.css or Quick CSS.
.term-jewelry .product h3.cufon_headings {
font-size: 20px;
}Another example is shoes. You can add .term-shoes instead.
Regards,
Ismael
In reply to: Mega menus
Hi,
I don’t see anything on the website. My suggestion is to make the font size small. Maybe you might have to do it by separating some of the menus. Please make the site live so that we can inspect it.
Regards,
Ismael
Okay some basic questions:
I have Abundance and have used shortcodes to put products into certain pages not just the SHOP page. i.e: Bracelets on a bracelet page, Necklaces on the Necklace page, etc. But now I want to add CSS to make the font and sizes specific to my products across the board.
Where do I put the CSS code, in the quick CSS? and how do I specify my products on this one.
Also my pictures are showing up stretched, I imported them before I got this theme do I have to upload them again or where do I see the correct sizes they should be not to be misshapen? how do I fix this…
Thanks.
Hope you can help a newbie…
KDS
In reply to: Enfold – fixed font-sizes?
Hi bluemoonink,
I prefer it simply because it allows me to have control over the end result just a little bit more. If you also start with a base size, you know every other percentage css is based on a base size.
But you are always open to changing things as you want :)
Regards,
Devin
In reply to: Adjusting Font Sizes
Yes, insert following code into the chick css field and adjust the font size value:
h1 { font-size: 34px; line-height: 1.1em; margin-bottom: 14px;}
h2 { font-size: 28px; line-height: 1.1em; margin-bottom: 10px; }
h3 { font-size: 19px; line-height: 1.1em; margin-bottom: 8px; } /*28*/
h4 { font-size: 17px; line-height: 1.1em; margin-bottom: 4px; } /*21*/
h5 { font-size: 16px; line-height: 1.1em; } /*17*/
h6 { font-size: 14px; line-height: 1.1em; }In reply to: Adjusting Font Sizes
Hi!
Insert following code into the quick css field:
.main_menu ul:first-child > li > a {
font-size: 13px;
}and use another font size value.
Best regards,
Peter
Topic: Adjusting Font Sizes
Topic: Enfold – fixed font-sizes?
Hi:
Just purchased this theme – I LOVE it… most flexible & well thought out I’ve seen.
I don’t really want fixed font sizes for body text & headers, but it looks like that is how the css is? base font 13px and then headers, starting with h6 at 14px? I see it here in base.css:
body {
font: 13px/1.65em “HelveticaNeue”, “Helvetica Neue”, Helvetica, Arial, sans-serif;
color: #444;
/* -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
-webkit-text-size-adjust: 100%;
}
though everywhere else font-size is “100%”.
If I add css to custom.css like this:
body {
font-size:100%;
}
It then uses my browser font size. Is this the correct way to do this? Will it adjust all the headers accordingly? Will mobile still be ok? Is there a reason that I should know why you used a fixed font-size…???
Just want to know so I don’t inadvertently break something…
thank you
Hey mohitso,
Can we see your site live? We can inspect the code and see what css should be used to accurately target your main menu and make the font size larger.
Regards,
Devin
This is what my quick CSS looks like now and its not working, any ideas? Ijuyst want the words bigger.
it doesnt seem to change the size.
#header {
position: fixed;
}
#main {
margin-top: 152px;
}
#top .social_bookmarks li a {
font-size: 30px;
}
.main_menu ul:first-child > li > a{
font-size: 21px;
}
In reply to: Larger Font in the header
it doesnt seem to change the size. Here is what I have in my quick CSS:
#header {
position: fixed;
}
#main {
margin-top: 152px;
}
#top .social_bookmarks li a {
font-size: 30px;
}
.main_menu ul:first-child > li > a{
font-size: 21px;
}
In reply to: Larger Font in the header
ADMIN PANEL > Enfold Theme Options > Styling > Quick CSS (paste code) :
.main_menu ul:first-child > li > a{
font-size: 21px;
}
In reply to: Enfold Feature Requests
Hi
Great theme.
1. Agree with Sebastian’s suggestions for small fixed header WITH social icons?
2. Control over main menu fonts/size/colour [can’t see how to do this without CSS, correct me if it’s already there]
Thanks
In reply to: Social media icons
Hi yingfuli,
Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:
#top .social_bookmarks li a {
font-size: 17px;
}Adjust the font size as needed. Though it does degrade a bit at that size (the default is 13px).
Regards,
Devin
In reply to: Enfold Feature Requests
(from 10+ posts)
Here is my wish list so far. Thanks!
1. Ajax Portfolio. Please also consider an option to have a link for both quick view and detail view. Some users may want the option to go directly to the detailed view. How about the option to have different hover icons and hover styles.
2. Portfolio/Blog Slider. Please consider improving the navigation arrows. Difficult for user to know there is more to scroll without hovering over the image.
3. Masonry Blog Layout. Please consider more layout options for Blog, possibly masonry/magazine type layout, etc.
4. Timeline Component. Would be great to integrate a javascript timeline component, such as the one from VeriteCo.
5. Small header with menu and icons, with header piece being fixed, possibly shrinking also.
====================
A few more suggestions…
1. Portfolio – Please consider a Load More button function as an option instead of of the page based pagination. Load More provides better dynamic user experience with the ability to see more items on the same page.
2. Ajax Search – Please provide a way to use the Ajax Search in the side bar and/or on a page as a page builder element.
3. Breadcrumbs – Please consider adding Breadcrumbs as a short-code where it can be placed at top of the page above title. Difficult for some users to find the breadcrumbs when it’s aligned to the far right.
4. Contact Form – Definitely need more fields like pick-list, drop-downs, etc. Also need more flexibility when using Google maps like height adjustments, etc.
5. Newsletter – Please consider integration with newsletter like mail chimp and integration with contact form. Also would be nice to see login area and newsletter sign-up panels.
6. Theme Support – Please consider a different forum area for support. Seems like you can’t add attachments or screen shots, edit existing posts, etc. Seems very outdated as compared to other CMS forums.
=====
Hello.
1. Small fixed header with social icons and menu. With the option to have just the header (logo + menu) part fixed and shrinking.
2. Better mobile menu, like others have mentioned. Perhaps off canvas style.
3. Colored Section that works with side bar not just full width.
4. Masonry option style for both portfolio and blog items.
Please consider an option to have a separator line style between sidebar items, like between categories and latest posts, etc. Would also be nice to apply a colored section for sidebar sections and maybe more title options for sidebar modules. Thanks.
================
By the way, I hope the Ajax Portfolio is implemented like the Choices template, where the item is shown on the same page as the portfolio.
I also really love the hover effect, where the hover overlay follows the cursor movement on the Choices portfolio. Please consider adding this as an option.
Thanks!
=====================
Would really like to see the Breadcrumbs as a short-code. I often you use a header background image with the page title. This does not seem to be an option with the current design. I would like to be able to place the Breadcrumbs above my articles, not to the far right. Thanks.
===============
Would really like to see a Load More function as an option to the portfolio, instead of pagination. This would create a much better user experience and is more in line with current design patterns. And please consider different hover overlays. I like the portfolio item overlay from the Choices theme much better. Thanks.
========================
Breadcrumbs Shortcode – Please consider an option to include “breadcrumbs” as shortcode. I would like to use my own Heading text with background image and then add the breadcrumbs to that image. It would also be nice to place the breadcrumbs in a different position, for example, above the article title. Current design is not very flexible. Thanks.
=======================
Blog Layout – Please include an option for an author block on every post. Seems odd that the blog doesn’t support this. Would also like to see a masonry blog layout. Current grid layout is not useful for images with different sizes and looks kind of bland. Also, why is there a light-box hover on every post image. Should be an option to turn this off.
And please-please consider a “Load More” option for both Portfolio and Blog instead of just next-page pagination. Load More is being used more and more and has a better user experience.
Portfolio Layout – Assuming that the ajax portfolio is coming, please consider the preview panel above the portfolio grid on the same page, or even better, in between (above or below) the item that was selected. Also nice to have a link for preview or full view. For my case, a light-box link is not necessary. And it would be awesome if there were more hover overlay options. Really like the one from Choices theme.
Please improve the page builder so we can edit the code that is produced for each page. This would allow us to enter custom classes for images, for example, custom overlays, etc. Doesn’t seem very open right now and restricts creativity. Thank you. :)
=========
Please add an option to disable the hover lightbox for selected Post / Portfolio images. At least for my case, my sites are based on content and I have no need to use the lightbox on my images. The hover effect is very distracting when trying to read an article. Having an option to selectively set this for each article would be great. Thanks.
========
Regarding the “Load More” function for Portfolio showcase and Blog, have you considered an “Infinite Scroller”? I believe that some of them also offer a manual setting, which would be similar to a “Load More” button. Thanks.
========
Regarding the theme icons, I hope the icon list get’s updated. I definitely prefer font awesome, which I feel has a much better selection of icons, especially for my business. It would also be nice to have the icons as short-codes, so they can be used within the page builder. Of course, it would be nice to select the icon size. I have seen this feature with many of the other themes. Thanks.
=======
Would love to see the breadcrumbs as a short-code, where I can insert into my desired location. Having it in the upper right header, forces me to use the page header. And it’s not the desired location for our users. I prefer to use my own header using the layer slider and hen I can place the breadcrumbs above my articles or anywhere in my header. Thanks..
In reply to: change menu font and header background.
Hi,
Go to Theme Options > Styling > Header Tab. You can select various background images or upload your own.
To change the font size and make it uppercase, edit custom.css and add this code
#menu-navigation li a {
text-transform: uppercase;
font-size: 15px;
}Regards,
Ismael
Hi, I configured the background for the header part, but nothing happens, is it a bug? details pls. refer to my site at http://www.fujianshipbuilding.com.
Also I want to change the font and size of menu, and make it upcase, how to change?
Thanks!
