Hm, this didn’t change anything.

Here’s all the code added into the Quick CSS. Do you think any of the following is messing it up?

#footer .social_bookmarks li a {
  border-radius: 100px!important;
}

#footer .social_bookmarks li {
clear: none!important;
}

#footer .social_bookmarks li {
  clear: none;
  border-color: #222222;
}

.main_menu ul:first-child > li > a {
font-size: 16px;
}

.main_menu ul:first-child > li > a { font-family: "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif; }

/* changes menu font*/
#top .main_menu .menu li ul a { font-size: 14px; }

#top .av-main-nav > li > a { font-family: "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif }

#footer .widgettitle {
font-size: 16px;
}

.widget {
font-size: 14px;
}

.header-scrolled .logo img {
padding-top: 5px;
}

.logo img {
padding-top: 5px;
}

.logo img {
padding-bottom: 5px;
}

/* This takes out the green hover icon over pictures */
.image-overlay { display: none!important; }

#top #wrap_all .header_color .av-menu-button-colored > a .avia-menu-text {
    background-color: transparent;
    color: black;
    border-color: transparent;
}

#top #wrap_all .header_color .av-menu-button-colored:hover > a .avia-menu-text, #top #wrap_all .header_color .current-menu-item > a .avia-menu-text {
    background-color: #016852;
    color: #ffffff;
    border-color: #004630;
}

• This reply was modified 10 years, 5 months ago by erusko.

Hi Rikard,

Thanks for your help. I just found the solution to my problems. It was in the css code which i created during my time of using enfold. I’m not sure where but when I used my website without the css styling code, the problem disappeared. I just found out that most of my css edits can be replaced by edits in the theme-editor.

Kind regards for your help!
Jan

Four your idea, how my CSS used to look:

.form-allowed-tags { display:none; }
h1, h2, h3, h4, h5, h6, #top .title_container .main-title, tr.pricing-row td, #top .portfolio-title, .callout .content-area, .avia-big-box .avia-innerbox, .av-special-font, .av-current-sort-title{font-family: Arial, ‘HelveticaNeue’, ‘Helvetica Neue’, Helvetica, Arial, sans-serif;}

.logo a img {display: inline-block; vertical-align: middle;}

#header .menu-item a {line-height: 133px!important;}

.header_color .sub_menu>ul>li>a, .header_color .sub_menu>div>ul>li>a, .header_color .main_menu ul:first-child > li > a, #top .header_color .main_menu .menu ul .current_page_item > a, #top .header_color .main_menu .menu ul .current-menu-item > a, #top .header_color .sub_menu li ul a {color: #604a7b;}
#footer .widgettitle {color: #fcd5b5;}
.main_color .meta-color, .main_color .sidebar, .main_color .sidebar a, .main_color .minor-meta, .main_color .minor-meta a, .main_color .text-sep, .main_color blockquote, .main_color .post_nav a, .main_color .comment-text, .main_color .side-container-inner, .main_color .news-time, .main_color .pagination a, .main_color .pagination span, .main_color .tweet-text.avatar_no .tweet-time, #top .main_color .extra-mini-title, .main_color .team-member-job-title, .main_color .team-social a, .main_color #js_sort_items a, .grid-entry-excerpt, .main_color .avia-testimonial-subtitle, .main_color .commentmetadata a, .main_color .social_bookmarks a, .main_color .meta-heading>*, .main_color .slide-meta, .main_color .slide-meta a, .main_color .taglist, .main_color .taglist a, .main_color .phone-info, .main_color .phone-info a {color: #322832; }
.main_color .iconlist_content {
color: #322832; }
.main_color h2 {font-size: 18px; }
.main_color li {border-width: 1px;}
.main_color span.iconfont {background-color: #604a7b;}

.main_color .heading-color, .main_color h1, .main_color h2, .main_color h3, .main_color h4, .main_color h5, .main_color h6, .main_color .sidebar .current_page_item>a, .main_color .sidebar .current-menu-item>a, .main_color .pagination .current, .main_color .pagination a:hover, .main_color strong.avia-testimonial-name, .main_color .heading, .main_color .toggle_content strong, .main_color .toggle_content strong a, .main_color .tab_content strong, .main_color .tab_content strong a, .main_color .asc_count, .main_color .avia-testimonial-content strong, .main_color div .news-headline {color: #ff6666;}

.stretch_full.container_wrap.alternate_color.light_bg_color.title_container {display: none;}

.container_wrap {border-top-width: 0px; }

li:hover .avia-menu-fx, .current-menu-item>a>.avia-menu-fx, li:hover .current_page_item>a>.avia-menu-fx {opacity: 1; visibility: hidden;}

.alternate_color .heading-color, .alternate_color h1 {color: #fcd5b5;}
.breadcrumb-trail span {display: none; }

.content, .sidebar {padding-top: 50px; padding-bottom: 33px; }

body {font: 15px/1.65em “HelveticaNeue”,”Helvetica Neue”,Helvetica,Arial,sans-serif}

.main_content {font-size: 15px;}

.template-page .entry-content-wrapper h1, .template-page .entry-content-wrapper h2 {text-transform: none; letter-spacing: 1px;}

.av_promobox, .avia-testimonial-content {
border-radius: 5px;}

#footer .avia-slider-testimonials .avia-testimonial-content {border-color: #000;}
#footer .avia-arrow {border-color: #000!important;}

.av_one_full .avia-testimonial-content {margin-left: 100px;}
.avia-promocontent h3 {margin-top: 12px;}

.avia-team-member .team-social {
border: none;}

.avia_transform .av_slideshow_full .active-slide .avia-caption-title, .avia_transform .av_fullscreen .active-slide .avia-caption-title {text-transform: none !important; }

.main_color .avia-icon-list .iconlist-timeline {border-color: #fff;}
.minitext {display: none; }

.av-share-box .av-share-link-description {display:none}

Hi Yigit,

thanks for that. I’d forgotten how to do that.

One question though. We’d like to move the widget to above the social icons. So it would sit below the menu and above the icons. Is this possible?

Screenshot of what I mean http://screencast.com/t/ZtkeDILstvC7

URL of site: http://146.185.19.61/~afeechan/

Thanks for your reply. Sorry I wasn’t clear. In the Enfold Theme Options/General Styling, there is a field titled Custom Background Image where you can upload an image to the ‘Logo Area’ (per the description)
The image I have there now is 1700 x 588 in the large size, which is what I select before clicking the Use Image Button. However, it doesn’t fill the area as it used to. This is what it looks like now:

I need to be able to tell my graphic artist the proper dimensions to more fully fill the black space; or if the dimension I have is correct, I need to know how to make it show up in the larger size. Before I cropped the bottom to prevent it from overlapping the menu area, it filled about 3/4 of the horizontal area, leaving the social profiles area on the right and an equally-sized black area on the left. I didn’t scale it – I cropped it – so the horizontal dimension (1700) is the same as it used to be.

It occurs to me that the Quick CSS contents may be responsible for this, but I’m afraid I’m not knowledgeable enough to determine that. The code that’s there currently is:
.content, .sidebar {
padding-top: 20px;
padding-bottom: 20px;
box-sizing: content-box;
min-height: 1px;
z-index: 1;
}
.avia-testimonial-wrapper {
display: table;
margin: 0px 0px;
clear: both;
}
body .column-top-margin {
margin-top: 20px;
}
.avia_textblock {
clear: both;
}
.avia-google-map-container {
margin-top: 20px;
margin-bottom: -10px;
}
.av-special-heading {
margin-top: 10px;
}
.av_promobox {
margin: 20px 0;
}
div .avia-table {
margin: 5px 0;
}
.phone-info {
margin: auto !important;
font-weight: bold;
line-height: 40px;
font-size: 36px;
padding: 0px 0px 10px 0px;
}
@media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo img {
max-width: 88%;
height: auto !important;
margin-left: 0!important;
margin-top: 5px!important;
}}
@media only screen and (max-width: 767px) {
.phone-info {
margin: auto !important;
font-weight: bold;
line-height: 22px;
font-size: 18px;
}}
p + h1, p + h2, p + h3, p + h4, p + h5, p + h6 {
margin-top: .5em;
}
.avia-icon-list li {
padding: 0 0 10px 0;
}
.avia-icon-list-container {
margin: 0px 0;
}
.avia-section {
clear: both;
width: 100%;
float: left;
min-height: 0px;
position: static;
}
.tabcontainer {
margin: 10px 0;
position: relative;
width: 100%;
clear: both;
overflow: hidden;
background: transparent;
}
media=”all”
ul.disc, .entry-content-wrapper ul {
list-style: disc outside;
}
ul {
list-style: none outside;
margin-left: 7px;
}
ul, ol {
margin-bottom: 0px;
}
ol, ul {
list-style: none;
}
h2 {
font-size: 28px;
line-height: 1.1em;
margin-bottom: 0px;
}
.av-countdown-timer {
clear: both;
position: relative;
opacity: 0;
margin: 5px 0;
}

.widget {
clear: both;
position: relative;
padding: 10px 0 10px 0;
float: none;
}
.main_color blockquote {border-color: #e1e1e1;}
.main_color strong {color: #666666;}

@media only screen and (max-width: 767px) { .responsive #top .header_bg {
background-position: 70% 50%;
}}

Again, thanks for your response and any help you can give me with these further details.

• This reply was modified 10 years, 6 months ago by cmerzut.

Hi Yigit,

Never mind, I’ve removed the header widget and I’m using Enfolds Social Icons in the header! Looks better that way too :D.

Is there however a way to display Enfolds social icons in the mobile menu?

Sincerely,
Barb

Hi Elliot,

Many thanks for getting back on this, and apologies for any confusion caused. I’m still getting to grips with this theme (one week in) and since I made this post I have discovered that although I used html code to create a list of share social medial icons in a widget in my previous theme, there is actually a shortcode in Enfold to do this (brilliant btw).

I have now placed a block of share social media icons n the footer using the shortcode, and styled the hover over color. The only issue I am having is that when I include a title for the widget area (SHARE) on hover a share message appears over each icon (e.g. “Share on Facebook”). However, as the widget is in a 1/4 footer area near the top of the footer, the share bubble and text doesn’t show fully. Can this pop-out window (data-avia-related-tooltip ?) be hidden with css, as with the existing footer widget title this extra information is not really needed?

Note that I have other tooltips on the site which need to remain active

Cheers,
Barnez

• This reply was modified 10 years, 6 months ago by Barnez1.

Hi Rikard,

I have done but it’s again sitting in the top header section. The widget needs to be in the social icon beside the logo, so I can a phone number and email.

Thanks,
Nep

Hi Elliot,

Many thanks for getting back.

1. See private content below for the PayPal link

2. This was my first attempt. I can create a text widget in the footer without any problems, but I can;t find any list of the shortcodes for the icon. Where might this be (as it’s not in the Appearance >> Widget area). Also, how would I set a link inside a shortcode? Could you please give an example?

Cheers,
Barnez

____________
EDITED:

I’ve found some useful info on this thread: https://kriesi.at/support/topic/i-want-to-add-social-media-in-widget/, and now have the Facebook, Twitter and Google+ share icons installed and working. Would it be possible to add the Tumblr icon to the list:

<ul class="noLightbox social_bookmarks icon_count_6"><li class="social_bookmarks_facebook av-social-link-facebook social_icon_1"><a target="_blank" href="http://www.facebook.com/sharer/sharer.php?u=www.proofscience.com&t=Scientific proofreading service available @ http://www.proofscience.com for researchers, students and all your document editing requirements." aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello" title="Facebook"><span class="avia_hidden_link_text">Facebook</span></a></li><li class="social_bookmarks_twitter av-social-link-twitter social_icon_2"><a target="_blank" href="http://www.facebook.com/sharer/sharer.php?u=www.proofscience.com&t=Scientific proofreading service available @ http://www.proofscience.com for researchers, students and all your document editing requirements." aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello" title="Twitter"><span class="avia_hidden_link_text">Twitter</span></a></li><li class="social_bookmarks_gplus av-social-link-gplus social_icon_5"><a href="https://plus.google.com/share?url=www.proofscience.com" onclick="javascript:window.open(this.href,
  '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello" title="Gplus"><span class="avia_hidden_link_text">Gplus</span></a></li></ul>

• This reply was modified 10 years, 6 months ago by Barnez1. Reason: Found part of solution to adding social media shares to footer

Oké Thanks Rikard, Would it be possible then to make 2 layers in the footer?
Maybe with a widget or someting?

Like here http://themeforest.net/item/enfold-responsive-multipurpose-theme/4519990
In the footer, where the envanto logo and community members are, is a different leven then where the social media icons are.
Would something like that be possible with Enfold?

Hope somebody has a sollution!

Best regards, Nadine

Dear Elliott
Thank you very much.
This is a link to our website http://goo.gl/5ngTJv
Actually I would like to have the widget in the Header Secondary Menu on the left of Account Login. If it not possible I may move the Header Social Icons to the Header Secondary Menu and I would like the switch at the left of the cart icon
Please see http://www.profumo.it/main-header.PNG and http://www.profumo.it/secondary.PNG

Thank you Mauro

Hi Yigit,

That didn’t quit work. Almost but the footer widget logo is off and the social icons are just too far right.