-
Search Results
-
In reply to: Enfold Feature Requests
I’m very enthusiastic about the new Masonry option, but also a bit disappointed by certain limitations. For example:
- The Masonry Gallery doesn’t seem to allow me to use thumbnails for the grid overview. In my case, where they click to view high quality jpgs, this means they load in a bunch of way too big pictures in the overview. The Media Gallery does have this option, making me wonder why this wasn’t implemented here.
- It would have been nice to set our own link to the items, for example link an item to a page, image, file (like PDF) or manual link.
- A “Load more” button instead of automatic loading when the visitor scrolls down.
I have hundreds of items in my portfolio grid, so logically the loading takes quite a while. To speed things up I would really like to find a similar solution as seen on sites like behance.net where the page loads 20 or so items and when the visitor scrolls to the bottom it automatically loads the next 20 and so on.
As this isn’t available in the Enfold theme (at least not at the moment), does anyone know a plugin or code that I can use to make this happen, please?
In reply to: Accordion Menu : Scroll to Opened Item
Hello!
You could turn off the option that only one toggle can be open at a time so that the others don’t close and the user is only left on the single one they are opening at that time.
But I don’t know of a quick fix for automatically moving the user to the newly opened tab right now. I’ll add it as a request/issue however and see if Kriesi can think of something.
Regards,
DevinIf there is a lot of content in an entry, and you scroll down to click the next entry, the whole item can move off the screen.
How can I set the accordion menu system to automatically scroll to the the top of the opened item?
Hi,
I’m trying to use Enfold with the very popular Scroll Triggered Box plugin (http://wordpress.org/plugins/dreamgrow-scroll-triggered-box/), but every time I install it my site crashes (had this with Enfold and WP Supercache btw), or the box appears hidden behind the footer. The purpose of this plugin is to offer a scrolling box where someone can subscribe easily to a newsletter and it auto-scrolls as they continue viewing the page.
Is Enfold just incompatible with this plugin? Thanks for any assistance on this.
– Joseph
In reply to: Enfold 2.2 breaks site logo image
Thank’s, thats a bit more idiot proof. Unfortunately that didn’t work. In fact, it introduced some other bugs.
Enfold 2.2 is trying to set the width on the image to 296px, but is not setting the height, resulting in the warping. My logo image is 300x91px. Under Enfold v2.1 this scales to 257x78px, because the image scales to the container size (.logo img { width:auto;height:auto; } in base.css).
When scrolling a small amount from the top of the page, the width stays fixed to 296px but the height shrinks, distorting the image massively.
It did fix the logo size changing when resizing the window width above and below 1160px.
tldr;
If you’re going to set the logo size with js, I think you need to set both dimensions, and remove the auto in base.css. Also you need to fix the behavior when scrolling.A question: Should my logo image be smaller?
Cheers,
JasonTry:
div.tubepress_container div.pagination { width: auto !important; }It seems to have some odd css on it that forces it to be larger than the window and gives it a horizontal scroll.
Hi – love the Enfold theme so far, but have a couple of items I hope you can help me with.
Here is the site I am building – http://www.pat-bach.com/breitercapital/
1. Footer size – How can I simply adjust the footer height size (specifically, make it smaller / shorter)? I’ve spent quite a bit of time researching / looking around / experimenting to no avail … is there a simple method that I am missing?
2. Menu item issue – I wanted to stop the header / menu from auto-sizing to smaller when scrolling. After some research / looking around for fixes, I added some quick CSS to achieve the desired result. However, now the individual dropdown menu item areas are huge. How can I make the dropdown menu item areas smaller without affecting the size of the overall header?
I am using the Small fixed Header type with the following quick CSS added:
#header_main .container, .main_menu ul:first-child > li a {
height: 78px !important;
line-height: 88px !important;
padding-top:3px !important;
font-size: 14px;
}
#header_main {
border-bottom: none;
}
#top .main_menu .menu ul li a {
font-size: 14px;
}
.main_menu .menu li {
height: 60px;
}
.logo img {
height: 128px;
width: 269px;
}
body .logo{
height:200%;
}
Hope this all makes sense … Thanks a million for any help you can offer!!
Thanks!
Hi!
I builded some contents with the Default Editor, and then switched to Advanced Editor to create a Fullwidth Easy Slider. When I switched back to Default Editor to edit some text (because when you generate columns with shortcodes, you can’t edit the text inside when in Advanced Editor, unless you generate a column with a Text Block inside :S): the content was just gone! I switch back to Advanced and the contents were still here, and show properly on webpage.
However, I defenitly prefer to use shortcodes instead of graphic interface, and, in an autosave, I found out that the Advanced Editor generated the following code for my portfolio project:
[av_slideshow_full size='no scaling' stretch='' animation='fade' autoplay='true' interval='5' src='' attachment='' position='top left' repeat='no-repeat' attach='scroll']
[av_slide_full id='2738' attachment='' title='' caption_pos='caption_bottom' link='' link_target=''][/av_slide_full]
[/av_slideshow_full]
[av_textblock]
<h3>Reina Sofía</h3>
[/av_textblock]
[av_two_third first]
Hil maximax imilluptate volento exerum si consenienet magnihi llitecepe laborep erorem fuga. Et fugiam arum is everferio quame voluptinvel eum ad qui nam aceped que dictibusam ipsande rspicip icipiendit as excerspiet lam fugia pelesed millorro omnim eaqui quod est plibearum fugiaep ellorum quatur.
[/av_two_third]
[av_one_third]
Mapa
[/av_one_third]
[av_hr class='invisible' height='20' shadow='no-shadow' position='center']
[av_portfolio columns='4' items='16' contents='title' preview_mode='auto' image_size='portfolio' linking='' sort='yes' paginate='no']So I pasted this code on a new entry to check how it looked like: the slider doesn’t appear full width but boxed; I switched to Advanced Editor and saved again, and now it shows full width with contents below, http://devargas.com.es/temp/advanced-editor.jpg buuut, we are back to the begining of this topic, the content is gone from Default Editor.
I think I found out a topic which seemed similar to my issue https://kriesi.at/support/topic/avia-layout-builder-text-content-doesnt-appear and checked the memory: using 52Mb out of 128Mb so it’s not a problem of memory. I also disabled all the plugins, but it’s not a conflict issue.
I’m using the last WordPress 3.6, downloaded your theme again this morning and updated parent theme, as I saw you made some fix lately.
So, how can I make contents appears when switching from one editor to the other, and/or how can I generate a fullwidth slider from short codes instead of using the Advanced Editor?
The site is curently under construction but if you would like to access it, I can provide you a subscriber user account in a private message. Thank you in advance, looking forward to hear from you.
Anne-Sophie
Hello developer,
I have encounter this bug which is happening only on Android based tablet like Samsung and xoom on lanscape mode. I think my client just hit the “INTERNET” icon from this tablets which is the default android browser.
Just launch website recently using enfold template. Very happy with everything except for this bug which needs a solution or way-out.
website: http://www.autogate.com.sg
i am facing a super weird issue with the menu in which it keeps showing on the 2/3 bottom of the screen instead on the top.
See images:
https://docs.google.com/file/d/0B480dDdNRBAHMUx6WWhuWXdUeVk/edit?usp=sharing
https://docs.google.com/file/d/0B480dDdNRBAHcl9aMk41bjN3UzA/edit?usp=sharing
All Desktop, Android mobile, iphone, even iPAD, Chrome, Safari, IE are all working perfectly. The menu is kept at the top. It only happens to android tablets which i think it is bigger than 1024px in width after looking at the camera shots on tablets.
I have tried with all kinds of configuration and this weird behavior is there there, happening.
Using Enfold Version 2.0.1
Tried with all kinds of config already but problem is still there.
Configuration
1. Responsive: Responsive Layout Default (1030px), Responsive Layout Large (1210)
2. All kinds of header settings: Fixed, Non-Fixed, with or without social icon. etc..
3. I have change code to have a fixed logo without resizing when scrollling but problem still there.
Question:
1. Is there a known fixed for the weird behavior of the menu showing on 2/3 below the page?
2. Besides forcing the menu into responsive menu by detecting the width of that tablet which i don’t think is the solution as it is wider than 1024px, is there other possible solution?
3. Is there other code fixes i can try to test it out?
Hope for an answer. thank you.
In reply to: Font rendering on safari/mac
Devin,
I turned off Jetpack, logged out of admin mode in WordPress, reset Safari (the browser I was using to effect the deactivating of Jetpack; in fact, the only browser I had running at the time), shut down Safari, restarted Safari, and ran some more tests. Here are my results:
Visited the site’s home page, but did not log in.
The headings in the header were colored blue, which is not correct. See this screen shot: http://bit.ly/1587FfC
Scrolled the page, which causes the heading to collapse
The background color of the collapsed header was not preserved, See this screen shot: http://bit.ly/17oUhGa
Logged in and changed from Salsa to Sunshiney
–Looks good (checked front page only)!
Changed from Sunshiney to Lobster
–Front page bad, but Digital Resources and About looks good!
Changed from Lobster to Yellowtail
–Front page, About Us, Digital Resources are all bad (“bad” — here and elsewhere — meaning HelveticaNeue is being rendered instead of the requested font)
Refresh Safari
–Front page, About Us, Digital Resources are all bad
Reset Safari
–Front Page bad, About us and Digital resources good
Log in to site (previous reset forced logout)
—Styling options still set to Yellowtail
—Home page, About Us, and Digital Resources all looks good
Changed from Yellowtail to Mate SC
–Front page, About Us, Digital Resources are all bad
Changed from Mate SC to Yellowtail
–Front Page bad, About us and Digital resources good
Changed from Yellowtail to Salsa
–Front page, About Us, Digital Resources are all bad
Switched from Safari to Firefox (23.0.1)
Viewed site without logging in
–Home page good, About Us and Digital Resources bad
Refreshed Firefox
–Home page good, About Us, and Digital Resources bad
Switched from Firefox to Safari (already logged into site on that browser)
–Home page good, About Us, and Digital Resources all bad
Refresh Safari
–Front page, About Us, Digital Resources are all bad
Inadvertently hit my Add to ReadLater toolbar button
After new tab showed up, on which Read Later login page displayed, closed that tab
The earlier preset tab, showing home page, refreshed automatically, and was now good!
Revisted About Us and Digital Resources, which were bad
Revisited Home page, which was now bad!
Reset Safari
Revisit home page, which is good
–About us and Digital resources bad
Refresh Digital Resources
—Digital Resources still bad, as is About Us; home page still good
Switched from Safari to Firefox
Viewed site without logging in (Home page still showing Salsa from earlier visit)
Refresh Firefox
Home page still good; About Us and Digital Resources bad
Hey,
Please deactivate your plugins. See if the issue persist. You can also try to re-create the home page from scratch. This is the whole shortcode:
[av_layerslider id='1']
[av_one_third first]
[av_icon_box icon='17' position='left' title='Checkit!']
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Aenean <strong>commodo ligula</strong> eget dolor. Aenean massa. Cum sociis
[/av_icon_box]
[/av_one_third]
[av_one_third]
[av_icon_box icon='50' position='left' title='Green Power']
Aenean massa. Cum sociis natoque penatibus et magnis dis <strong>parturient montes</strong>, nascetur ridiculus mus. Lorem ipsum dolor sit amet
[/av_icon_box]
[/av_one_third]
[av_one_third]
[av_icon_box icon='125' position='left' title='Recycle that']
Aenean commodo ligula eget dolor. Aenean massa. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cum sociis natoque <strong>sadfsadfas</strong>
[/av_icon_box]
[/av_one_third]
[av_section color='alternate_color' custom_bg='' src='' attachment='' position='top left' repeat='repeat' attach='scroll' padding='large' shadow='shadow' id='awesome-section']
[av_one_full first]
[av_textblock]
<h2 style="text-align: center;">Crazy cool usability features</h2>
[/av_textblock]
[av_hr class='short' height='70' position='center']
[av_textblock]
<p style="text-align: center;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <strong>Aenean</strong> commodo ligula eget dolor.
an massa. Cum <strong>sociis natoque</strong> penatibus et magnis dis parturient montes, nascetur ridiculus mus.
[/av_textblock]
[av_hr class='invisible' height='70' position='center']
[av_portfolio columns='3' items='3' contents='title' linking='' sort='no' paginate='no']
[av_hr class='short' height='70' position='center']
[av_textblock]
<p style="text-align: center;"><a title="Portfolio 4 Columns" href="#">View the Full Portfolio here</a></p>
[/av_textblock]
[av_hr class='short' height='70' position='center']
[/av_one_full]
[/av_section]
[av_section color='main_color' custom_bg='' src='' position='top left' repeat='no-repeat' attach='scroll' padding='large' shadow='no-shadow']
[av_one_half first]
[av_gallery ids='316,315,314,313' style='big_thumb' preview_size='portfolio' columns='7']
[/av_one_half][av_one_half]
[av_textblock]
<h2>Any Layout imaginable</h2>
[/av_textblock]
[av_hr class='short' height='70' position='left']
[av_textblock]
Lorem ipsum dolor sit amet, consectetuer <strong>adipiscing elit</strong>. Aenean commodo ligula eget dolor. Aenean massa.
<ul>
<li>Nulla consequat massa quis enim.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</li>
<li>In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.</li>
<li>Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.</li>
<li>Aenean <strong>vulputate</strong> eleifend tellus.</li>
</ul>
[/av_textblock]
[av_hr class='short' height='70' position='left']
[av_button label='Learn more...' link='manually,http://' link_target='' color='theme-color-subtle' custom_bg='#444444' custom_font='#ffffff' size='large' position='left' icon_select='yes' icon='121']
[/av_one_half]
[/av_section]
[av_section color='alternate_color' custom_bg='' src='' position='top left' repeat='no-repeat' attach='scroll' padding='large' shadow='shadow']
[av_one_half first]
[av_textblock]
<h2 style="text-align: right;">About Us</h2>
[/av_textblock]
[av_hr class='short' height='70' position='right']
[av_textblock]
<p style="text-align: right;">Lorem ipsum dolor sit amet, consectetuer <strong>adipiscing elit</strong>. Aenean commodo ligula eget dolor. Aenean massa.</p>
<p style="text-align: right;">Nulla consequat massa quis enim.
Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.
Aenean <strong style="text-align: right;">vulputate</strong> eleifend tellus.
[/av_textblock]
[av_hr class='short' height='70' position='right']
[av_button label='Check out our Team' link='manually,#top' link_target='' color='theme-color-subtle' custom_bg='#444444' custom_font='#ffffff' size='large' position='right' icon_select='yes' icon='14' custom_class='']
[/av_one_half][av_one_half]
[av_iconlist position='left']
[av_iconlist_item title='Crafted with love' icon='43']
Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in.
[/av_iconlist_item]
[av_iconlist_item title='Melodical by nature' icon='51']
Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt.
[/av_iconlist_item]
[av_iconlist_item title='Lightning Fast' icon='64']
Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, quis gravida magna mi a libero.
[/av_iconlist_item]
[av_iconlist_item title='Freaky Flags' icon='41']
Nullam quis ante. Etiam sit <strong>amet orci eget</strong> eros faucibus tincidunt. Donec vitae sapien ut libero venenatis faucibus.
[/av_iconlist_item]
[/av_iconlist]
[/av_one_half]
[/av_section]
[av_section color='main_color' custom_bg='' src='' position='top left' repeat='no-repeat' attach='scroll' padding='default' shadow='no-shadow']
[av_one_half first]
[av_image src='745' attachment='' align='' animation='right-to-left' link='' target='no' custom_class='']
[/av_one_half][av_one_half]
[av_textblock]
<h2>Mobile Ready</h2>
[/av_textblock]
[av_hr class='short' height='70' position='left']
[av_textblock]
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
Nulla consequat massa quis enim.Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.Aenean vulputate eleifend tellus.
[/av_textblock]
[av_hr class='short' height='70' position='left']
[av_button label='Mobile Features' link='manually,http://' link_target='' color='theme-color-subtle' custom_bg='#444444' custom_font='#ffffff' size='large' position='left' icon_select='yes' icon='2']
[/av_one_half]
[/av_section]
[av_section color='alternate_color' custom_bg='' src='' position='top left' repeat='no-repeat' attach='scroll' padding='large' shadow='shadow']
[av_textblock]
<h2 style="text-align: center;">What others say about us</h2>
[/av_textblock]
[av_hr class='short' height='50' position='center']
[av_testimonials columns='2']
[av_testimonial_single src='315' name='The Man' subtitle='CEO' link='http://www.wikipedia.com' linktext='WikiTravel']
Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.
[/av_testimonial_single]
[av_testimonial_single src='315' name='Anna Vandana' subtitle='CEO' link='http://www.wikipedia.com' linktext='Media Wiki']
In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.
[/av_testimonial_single]
[av_testimonial_single src='315' name='Maxi Milli' subtitle='CEO' link='http://www.wikipedia.com' linktext='Max Mobilcom']
Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
[/av_testimonial_single]
[av_testimonial_single src='315' name='Dr. Dosist' subtitle='CEO' link='http://www.wikipedia.com' linktext='Doom Inc']
In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.
[/av_testimonial_single]
[/av_testimonials]
[/av_section]
[av_slideshow_full size='no scaling' stretch='image_no_stretch' animation='slide' autoplay='false' interval='5' src='' position='center center' repeat='stretch' attach='scroll']
[av_slide_full id='745' title='' caption_pos='caption_right caption_right_framed caption_framed' link='' link_target=''][/av_slide_full]
[av_slide_full id='745' title='' caption_pos='caption_bottom' link='' link_target=''][/av_slide_full]
[/av_slideshow_full]
[av_layerslider id='2']Regards,
Ismael
Topic: Mini Logo squeezed IE8
My logo looks great in all browsers but IE8. The larger logo looks fine, but when I scroll down the page and it changes to the ‘mini logo,’ it looks squeezed. This only happens in IE8. I’ve imported the logo at 200×100. Any help would be greatly appreciated!
This is the only custom css I have:
#menu-item-search {
display: none;
}
img {
height: auto;
width: auto/;
max-width: 100%;
}
In reply to: Scrolling client logos – infinite loop
That is completely different than what I’m suggesting and really we are not able to walk you through creating it. We don’t have an open book for every effect possible with the LayerSlider.
What that appears to be is a LayerSlider slideshow set to autorotation with multiple slides of the same image repeated and animated on top of itself 8 times.
So this image: http://clientbased.com.au/wp-content/uploads/2013/07/CBS-client-logos.jpg is in the LayerSlider 8 times and each is animated to get that effect.
The exact details of it are unknown without seeing it live.
For the above settings, if you have multiple images in your slideshow and they are not animating you are probably on WordPress 3.6 but not Enfold version 1.9.1. If you are not, then you need to add multiple images in order for the slider to animate.
In reply to: Scrolling client logos – infinite loop
Nope. That didn’t help. I was asking what those settings would be?
The options are as follows…
Slideshow Image Size
(I check ‘no scalling’ which doesn’t work either, makes it smaller than it really is)
Slideshow Transition
( Checked to ‘Slide’)
Autorotation active?
(Checked to ‘Yes’)
Slideshow autorotation duration
(You have several options to choose from beginning from 3 seconds to 100)
The image just sites on the screen and does nothing.
None of these options allow the big long strip of logos to scroll from left to right in a seamless endless loop????
PS. This is what I want to do…
Hey Guys I know this stuff has been asked before but I am not able to find a straight forward answer that say. I am a bit of a novice fyi. my site is http://www.jackandaddi.com for reference.
PART 1
I have assigned a fixed header with social icons. the container height is being set at 116 px and then when you scroll down it shrinks to 58 px I think. I want to change the height to be something more like 80 px at the largest. It is too tall and the logo wont center in that space. I am running a child theme setup. in layout.css I found
.social_header #header_main .container, .social_header .main_menu ul:first-child > li a { height:116px; line-height: 116px; }
and changed it is say 80 px height and line-height. and then copy pasted that code into my styles.css in my child theme. But nothing changed? Is this the wrong code to change?
PART 2
On my single blog post pages I want there to be no sidebar. so I can place large picture sliders on the main content area. I have the blog style set to Single author big preview image. And no sidebar selected on the single blog post pages.
The blog meta info, post title, body text content, and anything I place in the post all gets squished into a 600px wide container. I want this to be larger. I want it to match the feature image with of 1030px. so like above in layout.css I found this code:
#top .fullsize .template-blog .post-title{text-align: center; font-size: 30px; padding:15px 0; max-width: 800px; margin: 0 auto;}
#top .fullsize .template-blog .post .entry-content{text-align: justify; font-size:15px; line-height: 25px; max-width: 800px; margin:0 auto; overflow: visible; }
#top .fullsize .template-blog .post .entry-content > *{ max-width: 800px; margin-left:auto; margin-right:auto; }
.fullsize .big-preview .avia-gallery {
width: 600px;
max-width: 100%;
margin: 0 auto;
}
I changed all the max-widths to 1030px and then copy pasted this into my child theme style.css file and nothing changes. Is this the rigth code to manipulate. I don’t want to do it with the post id EVERY time I want all posts to be that wide.
Please help, Thanks.
In reply to: Scrolling client logos – infinite loop
On your Advanced Layout Editor layout drag and drop an Easy Slider into your layout. Next, click the button to add an image and add your image(s) into the slideshow.
Now that your images are in the slideshow you can adjust the options to make it transition, autorotation, autorotation duration and that is all there is to it.
To see an example of adding an Easy Slider watch this video at the marked time where I add one in and modify its settings: https://vimeo.com/64927358#t=183
In reply to: Scrolling client logos – infinite loop
Hi Devin.
Thanks for replying. As mentioned in my original request what you’ve said is what Ismael said originally but doesn’t help. I know the logos are one long strip (That’s the obvious part) but what exact settings are used to create ‘Auto Rotate’? I can’t find it.
This does not make sense…
“You then add that as a “slide” for any of the sliders and make it auto rotate with similar images showing multiple inline logos.”
I can assure you that I am not an idiot. So far this has been the only thing that has stumped me with the theme. It is surprisingly difficult to make this simple transition happen. I am not alone as others have asked the same question and have given up. I almost gave up too and had to do a hack version just to keep my client happy.
So could I please get step by step instructions on how to do it as originally requested. Even screen shots would be bloody nice.
Regards
Jamie
In reply to: Scrolling client logos – infinite loop
Hi jmr7877,
I believe what that user did was create a strip of logos that were a single image. Not each logo individually but one wide image with all of the logos on it.
You then add that as a “slide” for any of the sliders and make it auto rotate with similar images showing multiple inline logos.
Regards,
Devin
In reply to: Enfold tablles
Hi,
You are using version 1.6 of the theme while the current version is 1.81 , please update since quite a lot has improved.
—-
I looked at your code. you have links with this js onclick=”window.open(this.href,’livedealer_popup’,’height=500,width=500,scrollbars=yes,menubar=no,resizable=0,status=0,titlebar=0′);return false”
That will look bad on smart phones since height is in there.
—
Ok I will show you here briefly how to target the table and use media queries to resize it. We will take control away from html so your 100% width tag will be ignored, and give it to css. We will be targeting 4 screen sizes (you can add more yourself since this isn’t rocket science exactly): monitor, tablet landscape, table portrait / smartphone landscape, and smartphone portrait. Just add the code below to /css/custom.css … If your pages are pretty much the same format as this one, the code i will give will work for all pages.
.entry-content tr:nth-child(odd) {
background-color: #fbfbfb !important;
}
/*odd*/
.entry-content tr:nth-child(even) {
background-color: #e8ecee !important;
}
/* even*/
.entry-content tr:hover {
background-color: #fffbae !important;
}
/* hovering */
.entry-content table {
display:inline-table;
border:collapse;
width: auto;
}
/*
*/
@media only screen and (min-width:768px) and (max-width:989px) {
.entry-content table {
font-size:.7em;
}
.entry-content table tr td {
font-size:1.2em;
}
.responsive .container {
width:97%;
}
.responsive .container .twelve.units {
width: 99%;
}
}
/*
*/
@media only screen and (max-width:767px) {
.entry-content table {
font-size:.6em;
}
.entry-content table tr td {
font-size:1.1em;
}
.responsive .container {
width:77%;
}
.responsive .container .twelve.units {
width: 79%;
}
}
/*
*/
@media only screen and (max-width:479px) {
.entry-content table {
font-size:.6em;
}
.entry-content table tr td {
font-size:1.1em;
}
.responsive .container {
width:67%;
}
.responsive .container .twelve.units {
width: 69%;
}
}
/*
*/You need to play with the numbers while at different screen sizes to get it just right, but you have enough there to get you started.
But I think on smartphone screen sizes, the only viable thing would be to remove about 1/2 the columns and only leave the 3-4 most relevant ones. That can also be done with css.
Thanks,
NIck
Topic: Avia Menu – Repositioning
Hey Guys,
as I thought, my customer wants some modification to the main layer of the avia navigation. You may take a look at http://www.pcamobile.de/startseite/. You’ll notive the white right aligned area within the header… yeah, the menu should go there. *yikes*
I’ve figured out everything so far (reverse css engineering, doh), but there are a few difficulties.
1. The header size is set via jQuery (avia.js > avia_header_size) depending on the scroll event.
2. Repositioning with top:xx won’t do it…
Wait, I think I got an idea… if I would change the height of the top css too… gonna try it now…
Yep, works. Sometimes you have to start a thread to get the idea… lol… I’ll post this anyways.
So if someone likes to modify the avia menu position, you should add this css:
/* Main Navigation Mods */
.main_menu {height:25px; top:92px; right:-30px;}
.main_menu ul li a {height: auto !important; line-height: 20px !important;}
.main_menu ul:first-child > li > a {padding:0 7px; font-size:11px;}
#header .avia_mega_div {margin: -1px 0 0 0; padding: 1px 0 0;}
If you like the dynamic height of the header, you’ll have to mess with the avia.js located in js/ folder. I reposition the whole menu using a distance from top on .main_menu wrapper. So you have to add this to the function avia_header_size(). I’ve added top_height = $(‘.main_menu’).height() to get the current height of the header, set a static value topH for both full and half size. Then simply add it to the css class: $(‘.main_menu’).css({top: topH + ‘px’});
Don’t get it? Nevermind… it looks crappy anyways… :-/
In reply to: Quform not working
Hi,
Please edit footer.php, find this code
<a href='#top' id='scroll-top-link' class='avia-font-entypo-fontello'></a>
<div id="fb-root"></div>Below, add this code:
<script type="text/javascript">
jQuery(document).ready(function ($) {
var $link = $('#iphorm_fancybox_51e102a0950da');
if ($.isFunction($.fn.fancybox) && !$link.data('iphorm-initialised')) {
$link.fancybox($.extend({
inline: true,
href: '#iphorm-outer-51e102a0950da',
onStart: function () {
$('#fancybox-outer').css('opacity', 0);
},
onComplete: function () {
$('#fancybox-wrap, #fancybox-content').css({width: 'auto'});
$.fancybox.center(0);
setTimeout(function () {
$('#fancybox-outer').animate({opacity: 1}, 400);
$('#fancybox-overlay').css({height: $(document).height()});
}, 1);
}
}, {})).data('iphorm-initialised', true);
}
});
</script>Regards,
Ismael
In reply to: How to change height and opacity non-fixed header
Hi,
A non-fixed header is the type of header that this page has, so when you scroll, the header disappears. The fixed header shrinks but stays on top of the page when you scroll down.
Your question is about a non-fixed header (like the header on this page you are reading now) though I think you are asking about the fixed header.
The fixed header shrinks by 50% including the logo by use of jQuery. I don’t think opacity is used. Logo size on the demo site ( kriesi.at/themes/enfold is 231w/116h and it shrinks down to 116w/58h automatically via jQuery. The code is located in /js/avia.js in the function that starts on line 809 called avia_header_size()
Thanks,
Nick
In reply to: button in menu
Hi,
Ohh, I thought that was the design, lol.
Ok in that case:
1) replace the button code you are using with this (i trimmed some of the fat off it, and lot more can go i think, but ok for now):
.menu #menu-item-2193 a {
-webkit-backface-visibility:hidden;
-webkit-perspective:1000px;
background:#a1ce5e url(https://d7uu0v95k7d3j.cloudfront.net/wp-content/themes/enfold/images/layout/bg-button.png?6c6f23) repeat-x;
border-bottom:1px solid #a1ce5e;
border-bottom-left-radius:3px;
border-bottom-right-radius:3px;
border-image-outset:0;
border-image-repeat:stretch;
border-image-slice:100%;
border-image-source:none;
border-image-width:1;
border-left:1px solid #a1ce5e;
border-right:1px solid #a1ce5e;
border-top:1px solid #a1ce5e;
border-top-left-radius:3px;
border-top-right-radius:3px;
color:rgba(0,0,0,0.5);
cursor:auto;
font:normal normal 600 14px 12px 'Open Sans',HelveticaNeue,'Helvetica Neue',Helvetica,Arial,sans-serif;
height:30px !important;
line-height: 19px !important;
margin-left:0;
margin-right:0;
min-width:90px;
outline:rgba(0,0,0,0.5) none 0;
padding:5px 16px 10px;
text-align:center;
text-decoration:none;
text-shadow:rgba(255,255,255,0.09) 0 1px 0;
top:-10px;
vertical-align:text-top;
zoom: 1
}2) open up /js/avia.js and find block of code between lines 809-846 and replace it with this one below, they should look nearly identical but for 3 lines:
function avia_header_size()
{
var win = $(window),
header = $('.fixed_header #header'),
logo = header.find('.logo img'),
elements = $('#header_main .container, .main_menu ul:first-child > li > a:not(.avia_mega_div a)'),
element_button = $('.menu #menu-item-2193 a'),
el_height = $(elements).filter(':first').height(),
isMobile = 'ontouchstart' in document.documentElement,
scroll_top = $('#scroll-top-link'),
set_height = function()
{
var st = win.scrollTop(), newH = 0, newTopMargin =0;
if(st < el_height/2)
{
newH = el_height - st;
//header.removeClass('shadow');
newTopMargin = 52;
}
else
{
newH = el_height/2;
newTopMargin = 23;
//header.addClass('shadow');
}
elements.css({height: newH + 'px', lineHeight: newH + 'px'});
element_button.css({'margin-top': newTopMargin + 'px'});
}
if(!header.length) return false;
if(isMobile)
{
return false;
}
win.scroll(set_height);
set_height();
}Ok now if you ever change the menu, when you go to a live server, you need to remember to edit line 815 which has the menu-id hardcoded in there (#menu-item-2193) and to change it, as well as change it in the css, since any new website will obviously have new ID numbers.
Check you quick css, you have a block of css commented out, dont know if accidently or on purpose starting with this block below the button code –> /*blockquote {
Thanks,
Nick
In reply to: Enfold Slider not Working
Hi George,
After opening that slideshow go to the Global Settings tab and then scroll down to Slideshow. The first option needs to be set to be on (the green should show). It has the description “If enabled, slideshow will automatically start after loading the page.”.
Regards,
Devin
Hi!
The autorotation not playing is actually a bug, thanks for noticing and reporting it. It will be fixed with the next version :)
If you want to disable the slideshow links you would need to do that manually be editing the file config-temlatebuilder/avia-shortcodes/slideshow.php
scroll down to line 382 and edit the following:
Best regards,
Kriesi
In reply to: Problem with Form
Hello Nick,
Many thanks!!!
Last questions, is it possible to add a automatic Read more in excerpt on the blog?
http://blueberrywebsites.com.br/bbmarketing/blog/
and how to put a Read More like this:
http://blueberrywebsites.com.br/uromais/noticias/
And can I increase the height of the menu when it scrolled or increase the size of the logo when it scrolled?
In reply to: WPML copy content from ajax
Hi,
You are using photon.js which is resizing your images. I think that is part of jetpack plugin. Please turn off jetpack as in my experience that plugin is responsible for a quarter of all support issues or at least turn off its image resizing.
I use duplicate and then I decouple the duplication http://www.clipular.com/c?6288338927484928=Lk87W4U0oBA-iq67-c5Afr7gGoE&f=.png
Have the 3 main plugins of WPML running. translation management, string translation + main plugin.
To use copy, when you make and save the original text, scroll down to the bottom of the page and you will see a number of radio buttons with 3 choices as seen below. Make sure that you set Copy for the ones i listed below and click Apply right next to the radio buttons
http://www.clipular.com/c?6348812067012608=RcNhuaYzAhgIfpLbTLLxtNiqp6c&f=.png
_thumbnail_id Don't translate Copy Translate
_wp_old_slug Don't translate Copy Translate
_aviaLayoutBuilder_active Don't translate Copy Translate
_aviaLayoutBuilderCleanData Don't translate Copy Translate
_avia_builder_shortcode_tree Don't translate Copy Translate
layout Don't translate Copy Translate
sidebar Don't translate Copy Translate
header
_portfolio_custom_link Don't translate Copy Translate
_portfolio_custom_link_url Don't translate Copy Translate
_preview_ids Don't translate Copy Translate
_preview_display Don't translate Copy Translate
_preview_autorotation Don't translate Copy Translate
_preview_columns Don't translate Copy Translate
_preview_textWhen you now initially ho tosecond language page you should see something like this on top
http://www.clipular.com/c?5038743962517504=TSs6blsbN8gIk2NADgINR1ExqMg&f=.png
What’s interesting is that at that moment when you click copy content, even though nothing can be seen , it really is there. just click publish or save draft and when the page refreshes again you will see that indeed everything copies over.
So just remember to save as draft as first thing you do in order to make everything show up.
check the radio buttons for copy, thats the key to the whole copying business. I tested it and it copies perfectly, including the ajax bit.
http://www.clipular.com/c?6348812067012608=RcNhuaYzAhgIfpLbTLLxtNiqp6c&f=.png
Thanks,
Nick
Hi,
I want that when people click on my categories they see the articles in that category but only with excerpt. Like on my blog. (I use a blog module where I could configure that option)
Right now if I go in my categories I can see the full articles which is not cool because you have to scroll a lot in order to see all the blog posts in a specific category.
Can you tell me how I do that? I am quite surprised because on another theme I used before enfold it showed the post with excerpt automatically…
Moreover, I don’t want either the category pages to display title in header and I can’t figure out how to do it as well…
I am in mode maintenance so please don’t tell me to send you a link to my site I don’t want to put it online before it’s done.
Kind regards
In reply to: Enfold Feature Requests
So I drop also a few notes… :)
1. Avia Builder – More editor comfort
Include an option or function to make the elements at the top “sticky”. Maybe a small pin icon to fix it manually for the customer or by checking the scroll event when editing a post/page/cpt. Other form elements needs to be handled so the builder is always on top. Pages mostly do get very long and you have to scroll a lot at this point.
Short video of the idea: http://www.screenr.com/zl7H
2. Avia Builder – Debug features
Add a button (maybe beside the template button) to activate the debug field. Right beneath the field a memory allocated info could be added. This would save you guys alot of support requests… :)
3. Avia Builder – Copy/Paste
Add another Button to the builder wich enables copying of the whole post/page/cpt-layout so the shortcodes and content can be copied to a new post or a different site. Should be only a few lines of JS.
4. Avia Framework Options
Please extend the options provided. As mentioned from other users before, there are several things just missing, which could be easily added (like Google fonts, etc.). Additionally, I would like to have:
– some input fields to trim certain CSS aspects (margins, paddings, maybe also top and left settings)
– wpautop enable/disable
– Blog settings (more settings related to the blog page itself outside of builder)
– Adding text-shadows and MAYBE box-shadows as option (simple input field with rgba color picker)
– Font size settings (bodytext plus all headers)
Should be enough for now :)
