Sorry, the theme is Overlap, my mistake in the theme page. Regards.

Hi,

1. Icons CSS are all combined in one CSS file, that means they’re all will be loaded even you didn’t select them to display. Don’t worry! These icon files are static contents, they are added in the caches of client browsers, they will be loaded from your site only once on the first time they visit.

2. We use the whole CSS from the original FontAwesome ( http://fontawesome.io/assets/font-awesome/css/font-awesome.css ). As you can see in the above CSS link from FontAwesome site. They add querystring to the FontAwesome font files to make sure you’re using the correct version, it’s because this icon set updates and adds new icons so often. If there is no querystring, when we update the icons, your site would display the old ones instead.

Actually, it’s not only this theme that adds querystring to the FontAwesome icon files, even if you’re using the FontAwesome from any other themes or plugins such as Visual Composer, you will have the querystrings in the FontAwesome icon files too.

BTW, if you’d like to remove it, you’ll need to remove the current CSS file of the FontAwesome from Wyde Core plugin but use your own instead.

Adding the below code into functions.php in your child theme to remove CSS file from Wyde Core.

function overlap_load_fontawesome(){

    wp_dequeue_style('wyde-font-awesome');

    wp_enqueue_style('overlap-font-awesome', get_stylesheet_directory_uri(). '/font-awesome.min.css', null, null);

}

add_action( 'wp_enqueue_scripts', 'overlap_load_fontawesome', 999 );

Then upload your CSS file and font files to your child theme folder.

Hi,

1- Like i say i’m a bit of optimisation freak now. So i dont see the point of sending or charging the files if i dont need too. Could we work around that ?

2- Your explanation confuse me a little, if dont use a cache plugin, how could i serve a version of the file that dont exist anymore. And if i use one and update the theme (and so fontawesome), after each update i purge the cache anyway, so how could i serve the wrong version file ?

Maybe there is something that i dont know ? Because lot of my file have query strings (like any wordpress), but cache plugin get ride of all of them at the exeption of FontAwesome.

1. Actually, it’s not only this theme that combines all CSS files so they have been loaded even you’re not using them.

For example: When you use the Visual Composer plugin (without this theme), the whole CSS and scripts of all elements and features are in only one file. That means all styles of all elements are all loaded even you have only one element on the page.

This is because they want to have the less files on the page and charge only on the first load, they don’t need to load more files and more times. Maybe it can take the time on the first load but it seems to be faster when you open another page then. Because the browser loads the static files from the remote site only once but next time it uses them from the caches instead.

However, if you don’t need all icons but just ones you’re using, you can remove the current icon CSS file and use your own instead.

Edit functions.php in your child theme:

wp_enqueue_style( 'overlap-child', get_stylesheet_directory_uri() . '/style.css', array( 'overlap', 'overlap-main', 'overlap-icons' ), $version );

wp_enqueue_style( 'overlap-child', get_stylesheet_directory_uri() . '/style.css', array( 'overlap', 'overlap-main' ), $version );

- Add below code:

function overlap_load_fontawesome(){

    wp_dequeue_style('wyde-font-awesome');

    wp_enqueue_style('overlap-font-awesome', get_stylesheet_directory_uri(). '/font-awesome.min.css', null, null);

    wp_dequeue_style('overlap-icons');

    wp_enqueue_style('overlap-custom-icons', get_stylesheet_directory_uri(). '/custom-icons.css', null, null);

}
add_action( 'wp_enqueue_scripts', 'overlap_load_fontawesome', 999 );

So you will have your own FontAwesome icons CSS file and one of custom icons CSS file.

2. That’s possible! As you know the browser serve static content from its caches. Even you purge the cache on your server because that is the server caches. If you do not press a refresh button on your browser, it might serve the old files from the caches instead.

You can try it if you’d like. Change some value in CSS file in the theme, and purge the server cache. Then enter the URL to visit your site without pressing a refresh button.

Also, for the querystring from FontAwesome icon files, your cache plugin removes all querystrings from CSS & JS files. Of course, now there is no querystring on your CSS & JS files as you can see when you check your site with Google PageSpeed Insights. But the querystrings found in the result on pingdom.com that you sent me, it’s not a querystring from CSS file but it’s from the icon files since it comes with the FontAwesome CSS code inside the CSS file.

As I provided, you can edit the FontAwesome CSS file then add it to your child theme and use it instead of the original one from Wyde Core plugin.

Hi, i will try to replace the code, but the code you told me to replace is not exactly like you say :

Instead of havinh : wp_enqueue_style( ‘overlap-child’, get_stylesheet_directory_uri() . ’/style.css’, array( ‘overlap’, ‘overlap-main’, ‘overlap-icons’ ), $version );

i have : wp_enqueue_style( ‘overlap-child’, get_stylesheet_directory_uri() . ’/style.css’, array( ‘overlap-main’, ‘overlap-icons’ ), $version );

Regards.

No problem, it’s the same one because the key is the same as “overlap-child”. You can replace that line with the new one I provided.

Hi, i’m still trying to understand, what is the same as “overlap-child” ? If i dont have ‘overlap’ already, why add it ? whould not be : wp_enqueue_style( ‘overlap-child’, get_stylesheet_directory_uri() . ’/style.css’, array( ‘overlap-main’ ), $version );

way simplier ?

Also if by removing ‘overlap-icons’ from the enqueue request, why sould i dequeue it later ?

Regards.

I’m sorry but there is no easier way. That is the only way to remove the CSS of icons from the theme without editing the theme file directly.

The code I provided will remove the current overlap-icons and use your custom icons CSS instead.

So after you add the code, you will need to add a file “custom-icons.css” in your child theme.

Copy the whole code from icons.css in the overlap theme to this file, then remove any icons CSS code where you don’t need.

Like the custom icons above, you will need to add a new CSS file for the FontAwesome icon set to your child theme too. Then edit the CSS code to remove the querystring from the font file name.

It sounds difficult but it’s only way to remove the old icons that’s bundled with the theme to use your own CSS file instead.

i see, i already do the trick for FontAwesome

But my question was more, in this code of line, what is actually doing :

wp_enqueue_style( ‘overlap-child’, get_stylesheet_directory_uri() . ’/style.css’, array( ‘overlap’, ‘overlap-main’, ‘overlap-icons’ ), $version );

“overlap” “overlap-main” and “overlap-icons”

What each variable call exactly ?

Regards.

This page contains all details of wp_enqueue_style function -> https://developer.wordpress.org/reference/functions/wp_enqueue_style/

Hi wyde, thanks for the page, but this is not really the line but the 3 variables that i have question with :

“overlap” “overlap-main” and “overlap-icons”

Witch is the the role of each one ?

Since remember i miss already one, and my theme is working just fine…

Those 3 variables are a $deps parameter in that page. Your file depends on $deps, that means it will load those 3 files before your file. In my previous code, I removed “overlap-icons” from $deps so your site won’t load the icons from Overlap theme anymore.

Ok, then what files are calling the others 2 variables ? I’m asking because, you tell me that i should have 3 variable before modifications, but i only have 2 and experience no issues.

Also i have a small issue with fontawesome, half of the icons dont display properly (just blank, no visual errors), in front and back end ?

Hello,

1. Here is the code of the contact form on the One Page demo:

One Page Business:

<div class="col-sm-4">
<p>[text* your-name placeholder "Name *"]</p>
</div>
<div class="col-sm-4">
<p>[email* your-email placeholder "Email *"] </p>
</div>
<div class="col-sm-4">
<p>[tel your-tel placeholder "Phone"]</p>
</div>
<div class="col-xs-12">
<p>[textarea your-message placeholder "Message"]</p>
<p><input type="submit" value="Send Your Message" class="full" /></p>
</div>

One Page Agency:

<div class="row">
<div class="col-sm-6">
<p>[text* your-name placeholder "NAME *"]</p>
<p>[email* your-email placeholder "E-MAIL *"] </p>
<p>[tel your-tel placeholder "PHONE"]</p>
<p><input type="submit" value="Send Your Message" class="full" /></p>
</div>
<div class="col-sm-6">
<p>[textarea your-message placeholder "MESSAGE"]</p>
</div>
</div>

Also, we will include the contact forms in the demo content in the next update, thanks for reporting this issue.

2. Sure, you can insert the custom CSS as below to change the height of the sticky header:

#header.fixed .header {
    line-height: 85px;
}

3. Thanks for reporting this issue, we will update the FontAwesome icons in the next update.

Hi, thanks for the codes ! Also i never try the one-page function before, it is not counter-productive seo wise to have multiple page with low content ? they can be discover very easily by crawlers.

Regards.

Also, can i know what fil i should edit to grow the post summary from 2 lines to 5 ?

Regards.

1. I’m sorry but I’m not sure since I never compare the SEO results between one page and multi-page so I couldn’t answer this question.

2. If you’re using the blog posts with Large Image layout, you can insert below code to functions.php in your child theme:

function vela_excerpt_length( $length ) {
    $length = 120;
    return $length;
}
add_filter( 'excerpt_length', 'vela_excerpt_length', 999 );

Otherwise, please let me know what the layout you’re using or give me your blog page URL because I’ll need to inspect the code to provide the custom CSS to you.

Hi, the code dont seems to work, here the url : http://tinyurl.com/glb3cue

And for purpose SEO, did it is ok to disable or hide the page (with default wordpress backend) so it cant be found by crawlers at their url ? Or maybe there is a way with the theme to make the one page menu work only with a single page ?

Also the carroussel is king of slow, you can configure the delay on your others themes, could we have that too on Vela ?

Regards.

This code works thanks. But the text is now shifting to the top instead of centered up and down. Also, I am adding an image as the background and it keeps sizing it to large, which is causing the image placement to be off and the image doesn’t look right. Thank you for answering.

Sure, there are 2 ways to change the size of member photos.

1. Reduce the width of your column container so the Team Members Slider will be smaller. Edit the column, select the Design Options tab, then add the padding to both left and right.

2. Increase the number of members to display on screen. Edit the Vela:Team Members Slider element, change the Visible Items to 4 or more so you will have more items on slider and the photos will be smaller.

It’a MailChimp plugin. Also you can use the Contact Form 7 plugin instead. Create a form with 1 text input and 1 submit button, then add it into your page by using Visual Composer. If you’d like you can PM me your email so I can provide the code of the newsletter form.