Discussion on Vela - Responsive Business Multi-Purpose Theme

Discussion on Vela - Responsive Business Multi-Purpose Theme

By
Cart 2,052 sales
Well Documented

Wyde supports this item

Supported

1508 comments found.

HI Wyde, This is the account from which it was purchased. We need to have certain pages to have portfolio based on a single category. is it possible with this theme? Can you guys help us out.

Thank you for your questions! Unfortunately, the portfolio category archive page are not available in this theme in current version. We will add it in the future.

We are using the theme – Vela. we need to have certain pages to have portfolio based on a single category. is it possible with this theme? Can you guys help us out.

Please contact us from the account that purchased this theme to make sure you’re currently in the correct product page that corresponds to what you have purchased.

Hello, you know wordfence has been detecting me a file as malicious, is: Wp-content / themes / Vela / admin / redux-framework / inc / fields / ace_editor / vendor / mode-php.js

Is there any problem with it?

regards

It’s just a text editor script that’s included in the Redux Framework that we use it to build the theme options panel. However, we’ve checked that it won’t affect the theme even we remove that file so we will remove it from the theme in the next update.

Thank you very much for your help, best regards

The mobile menu does not allow me to click and navigation to pages that have sub-pages. Only the sub-pages work or menu items that do not have sub-pages.

If the parent menu is a page menu that have a link, when you click on it, it will bring you to the page instead of opening the sub-pages. If you have sub-pages, you should add Custom Links instead of Page to the parent menu, then set the URL to # so it will open the sub-pages when you click on it. Please see the menu on our demos: http://wydethemes.com/vela1/

Hi, great theme. I am trying to figure out how I can create a portfolio gallery (or something similar) with the Bubba effect so it opens up a bigger version of the image only (like PrettyPhoto. No need to go or jump to a new blog or post page as there is no content other than a larger image. Look forward to hearing your reply. Thanks in advance!

Hi,

The easiest way is using JavaScript. You have to add custom JavaScript below to Theme Options -> Advanced -> Body Content:


<script type="text/javascript">
    (function($){

        $(window).on("pageloaded", function () {

            $(".portfolio-grid .view .item").each(function(){
                $(this).find("a").attr({
                   'href': $(this).find("image").attr("src"),
                   'rel': 'prettyPhoto'
                }).prettyPhoto({
                    theme: 'dark_square',
                    deeplinking: false,
                    social_tools: false,
                    overlay_gallery: false,
                    show_title: false
                });
            });   

        });

    })(jQuery);

</script>

The script above will change the link of the portfolio so it won’t bring you to the portfolio post page but open the image in the lightbox instead.

Hi! Thanks so much for the quick reply. I put in the js code in the body (under options - advanced- body content) but it still opens up another page. It did not open the image in a lightbox. I used Vela Portfolio—> and then tried using both Grid without Space and Gallery with Space. Please let me know. The gallery was the primary reason why I purchased this theme but was expecting it to open a lightbox instead of a page / blog page. Hope to hear back from you. Thx.

I’ve tried it on our demo before I provide the code and it works fine.

Please make sure you’ve added the right code, please do not copy it from email but from the comment page. The code should be start with script tag, just remove pre tag from the code.

If it still doesn’t work, please PM me your site URL: https://themeforest.net/user/wyde#contact

My visual composer is inactive. I thought my licenses were for the use of the theme? Please send me activation code or instructions on how to activate. Thank you.

You don’t need to activate it, this option is available for users who putchased this plugin individually. Just ignore the notification message.

When I got to “edit page” and scroll down, the whole visual composer section (where I would typically make all my changes) is collapsed to just one line. When I try to click on anything, it sends me to the page to purchase it. If I try to go to “Front End” editor, it just takes me to the page but then spins with the Visual Composer icon indefinitely.

We’ve never seen this issue before, try to deactivate other plugins to see if it works.

Also, please make sure you’ve updated this plugin and the theme to the latest update.

If it doesn’t work, please PM me your site URL and admin login: https://themeforest.net/user/wyde#contact

Hello!

I have a few questions about your theme. 1. Woocommerce - how can I edit product/category header? - how can I edit product/category sidebar? 2. Blog post - how to remove the pink image hover effect? - how can I change blog post title (it says H3 but no change happens when editing H3 type)? 3. Navigation menu - how to change background color of the menu?

Looking forward to your prompt reply!

Kind regards, Tamara

Hello,

1. The product category page uses the same page settings from your shop page. When you edit your shop page, you can change the settings of the header options, title options and sidebar options so these will affect your product category page too.

2. You have to add custom CSS below to Theme Options -> Advanced -> Head Content to remove the pink background from the image:

<style type="text/css">
.image-wrapper > a{
background: none;
}
</style>

Regarding the blog post title, I’m not quite clear but if you’d like to change the post title font styles, please change it in Theme Options -> Typography -> Title Text instead. If not please provide me more details.

3. The only way is adding the custom CSS to Theme Options -> Advanced -> Head Content as below:

<style type="text/css">
    #header,
    #header.fixed{
        background: #272727;
    }
</style>

However, this is not available in the theme design so you should choose the background color that works with the menu color because it’s difficult to change the menu text color.

Hi there,

Is there anyway to include the Team Member photo in the full bio overlay?

Hi there,

The easiest way is using JavaScript. You have to add JavaScript below to Theme Options -> Advanced -> Body Content:


<script type="text/javascript">

    (function($){

        $(window).on("pageloaded", function () {

            $(".team-slider .team-member").each(function(){
                $(this).find(".member-full-content").prepend( "<p>"+$(this).find(".member-image > span").html() +"</p>" );
            });

        });

    })(jQuery);

</script>

Hello, I have a problem with a theme, I think it detects that the web page is viewed from a device and isn’t responsive, how should I fix it?

www.membrado.net

Hello,

Seems like you’ve edited the code of the theme. By default the main container of the page should have the ID “container” but yours is “containerx” so you have the white space on both sides of the page.

If you’ve never edited any template file, try to deactivate other plugins to see if it works.

Hi there..is there any way that I can put menu nvigation and logo in buttom only in homepage? My friend wants a full large slider image in homepage and at bottom is his logo and menu navigation, but only at homepage. Thanks

Hi there,

If you’d like to show the navigation and logo below the slider like on this page: http://wydethemes.com/vela1/

Of course it will show only on the home page as you can see on other pages, the menu will be at the top of the page instead:

http://wydethemes.com/vela1/about-us/ http://wydethemes.com/vela1/our-services/

Go to Theme Options -> Header, in the Header Position choose “Top of Content (Below Slider)”.

If this is not what you’re looking for please provide me more details or any screenshot.

Hi Thanks for kind replay, what you have shown to me is very close, until I realize what my friend need is for his homepage is fullscreen slider clean and neat and in footer there are navigation menus. Just like this https://goo.gl/photos/JkdN52ibtvWKHTqn9 Is that very doable with minimum skill of wordpress? Thanks

You can add custom CSS below to Theme Options -> Advanced -> Head Content to move the header menu to the bottom:

<style type="text/css">
    #header,
    #header.fixed,
    .admin-bar #header.fixed{
        position: fixed!important;
        top: auto;
        bottom: 0;
    }
</style>

Also, you can hide the page footer in Theme Options -> Footer, turn off both Footer Widget Area and Footer Bottom Bar.

However, by default the header menu doesn’t show the social icons, you will need to edit the header template file in “inc/headers/” but it’s not recommended because your change will be lost when you update the theme.

Hello, there was a plugin that was pre-installed “Slider Revolution” but there is a limited license that prevents me from using all of its add-ons, its an additional $25?

Hello,

The add-ons are available for users who have purchased the Slider Revolution plugin individually (direct buyer).

This plugin was packed with the theme and it’s free for you since we have purchased the extended license so you can use it normally without registering the product key.

Actually, we create any sliders on our demos without using any add-ons so you don’t need them. You can import demo sliders from the theme and you can also download slider templates here: https://revolution.themepunch.com/free-slider-exchange/#esg-grid-2-1-wrap

And then import them to your website in Slider Revolution page.

However, if you’d like to use the add-ons you will need to purchase this plugin individually to be a direct buyer.

Hi! Heard some great things about the support which is what helped me to decide on this theme :) I am trying to figure out how you got the email field under Where to Find Us / Subscribe to my Newletter at the bottom of this page:

http://wydethemes.com/vela1/

Thanks! Ro

Hi,

Sorry for the delayed response!

That’s a MailChimp for WordPress plugin: https://wordpress.org/plugins/mailchimp-for-wp/

To add the Newsletter form to the bottom of the home page, please follow this:

1. After you install MailChimp for WordPress plugin, go to MailChimp for WP -> Forms.

2. Put the code below into the input box below Form Fields:


<p>
    <input type="email" id="mc4wp_email" name="EMAIL" placeholder="Email Address" required />
    <input type="submit" value="Subscribe Now!" />
</p>

3. Copy the shortcode below the Save Changes button like “[mc4wp_form id=”xxxx”]”.

4. Navigate to Visual Composer -> Shortcode Mapper:

5. Click on Map Shortcode button and then put the shortcode copied from the 3rd step, click on Parse Shortcode.

6. Set the shortcode name such as “MailChimp Form” and save changes.

7. Edit your home page to add new element called “MailChimp Form” below the text “Subscribe to Newsletter” at the bottom of the page.

Hi, how can I add the total of visitors to a counter box?

The value in the Counter Box element is a static value, you will need to update it manually so it’s not suitable to display the number of visitors that is a dynamic or real-time value.

You should use the counter from the site you’re using to collect the visitors on your site instead. If that site provides the JavaScript, you can add it into the Raw JS element to show on the page.

I installed the Vela theme successfully. I managed my general settings in ‘theme settings’. However, when I go to customize there does not seem to be a way to actually adjust and edit the content and sections on the page. I am very confused. please help.

The Customize menu is only for customize your WordPress site settings like you can did in Theme Options. In order to edit the page content, you will need to go to the menu Pages to select the page to edit.

I have successfully installed the theme, adjusted my main settings in ‘theme options’ but have no ability to actually change the content within the template and cannot edit the page sections. why? and where would those tools be? When I go to ‘customize’ it gives me options to change the menus but no section to adjust the page body. help please.

You can edit/add the page content in Pages, select a page to edit with Backend Editor. Also, the easiest way to edit the page is navigating to the front end, if you’re logged in as admin, you will see a menu “Edit Page” in the admin bar, click on this menu to edit the page in the backend. Also, please make sure you’ve installed the Visual Composer plugin that comes with the theme.

Hello, how can I change the width where it turns into the mobile version? A user of my website uses a very small desktop monitor and the website turns into the mobile version on his computer, what code can I use to lower the mobile threshold. Thanks!

You have to override the main script from the theme by adding the custom script below to Theme Options -> Advanced -> Body Content:


<script type="text/javascript">

    (function($){

        $(document).ready( function () {

            $.extend(wyde.page, {

               initPrimaryNav: function () {

                console.log($(window).width());

                var self = this;

                $("#nav .menu a[href*='#'], .footer-menu a[href*='#']").each(function(){

                    if (this.pathname == window.location.pathname){

                        var $el = $(this);                        

                        $el.off("click").on("click", function (event) {   

                            var hash = self.getHash($el.attr("href"));
                            if (!hash) {
                                return true;
                            } else if (hash == '#') {
                                event.preventDefault();
                                return false;
                            } else {

                                event.preventDefault();

                                var $parent = $el.parents("ul");

                                if ($parent.find("> li > a").index(this) == 0) {
                                    self.scrollTo(0);
                                } else {
                                    if (self.scrollTimer) clearTimeout(self.scrollTimer);
                                    self.scrollTo(hash, { offset: -self.sectionOffset });
                                }

                                if (window.location.hash) {
                                    if (typeof window.history.pushState == "function") {
                                        history.pushState({ path: self.siteURL }, "", self.siteURL);
                                    }
                                }

                                return false;
                            }
                        });

                    }

                });

                if ( $(window).width() >= 992 ) {

                    if ($("#header .header-right").length) $("#shop-menu, #search").appendTo(".header-right");
                    $("#nav").prependTo(".header .nav-wrapper");
                    $("#nav li").removeClass("open");
                    $("#nav, #nav ul").css({ "display": "" });
                    $(".mobile-nav-icon").hide();
                    $("#nav").removeClass("mobile-nav").addClass("dropdown-nav");
                    $("#header").removeClass("mobile");                    

                    if ($("#header").hasClass("logo-center")) {
                        var logoMenu = $("#menu-center-logo");
                        if (logoMenu.length == 0) {
                            var centerPos = Math.round($("#nav > ul > li").length / 2);
                            $("#nav > ul > li").eq(centerPos - 1).after($("
  • “).append($(”#logo”))); if (this.onePage) this.initOnePageMenu(); } } $(”#nav li.menu-item-has-children”).each(function () { var rPos = $(this).offset().left + $(this).outerWidth() + $(”> .sub-menu”, this).outerWidth(); if (rPos > $(window).width()) $(this).addClass(“align-right”); else $(this).removeClass(“align-right”); }); } else { $(”#header”).removeClass(“scrolled fixed”).css({ top: ”” }).addClass(“mobile”); $(”#nav”).appendTo(”.header .container”).removeClass(“dropdown-nav”).addClass(“mobile-nav”).css(“display”, ””); $(”.header-right #shop-menu, .header-right #search”).appendTo(”.header .nav-wrapper”); $(”.mobile-nav-icon”).show(); if ($(”#header”).hasClass(“logo-center”)) { $(”.mobile-nav-icon”).after($(”#logo”)); $(”#menu-center-logo”).remove(); if (this.onePage) this.initOnePageMenu(); } $(”#nav li a[href*=’#’]”).click(function () { $(”#header #nav .menu”).slideUp(); }); $(”#nav li.menu-item-has-children > a”).off(“click”).on(“click”, function (event) { event.preventDefault(); var element = $(this).parent(“li”); if (element.hasClass(“open”)) { element.removeClass(“open”); element.find(“li”).removeClass(“open”); element.find(“ul”).slideUp(); } else { element.addClass(“open”); element.children(“ul”).slideDown(); element.siblings(“li”).children(“ul”).slideUp(); element.siblings(“li”).removeClass(“open”); element.siblings(“li”).find(“li”).removeClass(“open”); element.siblings(“li”).find(“ul”).slideUp(); } return false; }); } } }); }); })(jQuery);

    </script>

    The code above will display the mobile menu if the width of your browser window is 992px or smaller. Of course you can find and replace 992 in the code with any value.

  • Thats amazing support and amazing response, thanks so much

    Wyde

    I need some help on this page something is wrong and the video background can only be seen in IE

    https://longleafforestryinsurance.com/about-us/

    I havent added anything and Ive tried to disable everything and nothing helps. Any ideas?

    I tried it on my Chrome and Firefox, everything works fine. Also, your video background is working properly.

    Hello,

    I’m optimizing the theme for SEO audit purposes and the main blog roll (that shows blogs in large images), doesn’t have the title attribute in it. It has the alt attribute, but for SEO, it needs both.

    I’ve done some digging around the content.php file, and that’s where it displays the blog image. On line 31, the code is written out as below:

    wyde_post_thumbnails($image_size);

    Is there a way to modify this to perhaps add a filter or an array to add the missing title attribute within the image?

    Much appreciated for your time. Huy

    Awesome, that worked out perfectly! Thanks for the help.

    Is there a function that would also apply the title attribute to the image logo that’s on our nav bar?

    Of course! You can appy the title attribute by editing the logo template file in your child theme.

    1. Please update to the latest update of the Vela theme (1.9) to make sure the code we provided will work.

    2. Install and Activate Vela-Child-Theme.zip.

    3. Open cPanel File Manager, copy the logo template file from “wp-content/themes/Vela/inc/headers/logo.php” and paste the file in your child theme “wp-content/themes/Vela-Child-Theme/inc/headers/logo.php”.

    4. Edit “wp-content/themes/Vela-Child-Theme/inc/headers/logo.php” in your Vela child theme as follows:

    When you open the logo.php file, you will see 3 lines of this code (lines: 21, 36 and 51):

    <img echo="" wyde_get_attributes="" /> />

    Replace each of them with:

    <?php $logo_attrs['title'] = get_bloginfo('name'); ?> <img echo="" wyde_get_attributes="" /> />

    5. Save changes.

    Edit: I couldn’t post the right code here, the comment box replace some characters from the codes, please PM me your email so I can provide you the actual code: https://themeforest.net/user/wyde#contact

    Having hard time putting fontello icons in icon picker. php looks like this add_filter( ‘vc_iconpicker-type-openiconic’, ‘custom_iconpicker_type_openiconic’ ); function custom_iconpicker_type_openiconic($icons){ $logging_icons = array( array( “logging-1” => “Icon 1” ), array( “logging-2” => “Icon 2” ), array( “logging-3” => “Icon 3” ), array( “logging-4” => “Icon 4” ), array( “logging-5” => “Icon 5” ), array( “logging-6” => “Icon 6” ), array( “logging-7” => “Icon 7” ), array( “logging-8” => “Icon 8” ), array( “logging-9” => “Icon 9” ), array( “logging-10” => “Icon 10” ), array( “logging-11” => “Icon 11” ), array( “logging-12” => “Icon 12” ), array( “logging-13” => “Icon 13” ), array( “logging-14” => “Icon 14” ), array( “logging-15” => “Icon 15” ), array( “logging-16” => “Icon 16” ), array( “logging-17” => “Icon 17” ), array( “logging-18” => “Icon 18” ), array( “logging-19” => “Icon 19” ), array( “logging-20” => “Icon 20” ), array( “logging-21” => “Icon 21” ), }

    );
    return array_merge_recursive( $icons, $logging_icons );

    CSS is this

    @font-face { font-family: ‘logging_icons’; src: url(‘fonts/logging_icons.eot’); src: url(‘fonts/logging_icons.eot#iefix’) format(‘embedded-opentype’), url(‘fonts/logging_icons.woff2’) format(‘woff2’), url(‘fonts/logging_icons.woff’) format(‘woff’), url(‘fonts/logging_icons.ttf’) format(‘truetype’), url(‘fonts/logging_icons.svg’) format(‘svg’); font-weight: normal; font-style: normal; } }

    [class*=" icon-"]:before {
       font-family: 'logging_icons';
       speak: none;
       font-style: normal;
       font-weight: normal;
       font-variant: normal;
       text-transform: none;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;

    .icon-logging-4:before { content: ’\e800’; } .icon-logging-5:before { content: ’\e801’; } .icon-logging-6:before { content: ’\e802’; } .icon-logging-7:before { content: ’\e803’; } .icon-logging-8:before { content: ’\e804’; } .icon-logging-9:before { content: ’\e805’; } .icon-logging-10:before { content: ’\e806’; } .icon-logging-11:before { content: ’\e807’; } .icon-logging-12:before { content: ’\e808’; } .icon-logging-13:before { content: ’\e809’; } .icon-logging-14:before { content: ’\e80a’; } .icon-logging-15:before { content: ’\e80b’; } .icon-logging-16:before { content: ’\e80c’; } .icon-logging-17:before { content: ’\e80d’; } .icon-logging-18:before { content: ’\e80e’; } .icon-logging-20:before { content: ’\e810’; } .icon-logging-21:before { content: ’\e811’; } .icon-logging-1:before { content: ’\e812’; } .icon-logging-2:before { content: ’\e813’; } .icon-logging-3:before { content: ’\e814’; }

    Any ideas, i can give you the actual font file if you tell me where. Thanks!

    I did this and all I see is white boxes in the icon picker? Its like they are there but they aren’t if you know what I mean

    Can I add icomoon library, it seems like it would be easier?

    Sounds like it couldn’t download your icon files. Please make sure you upload all icon files to the right path. If you’d like you can PM me your site URL and login credentials so I can inspect the error and help you out: https://themeforest.net/user/wyde#contact

    Also, you can add iconmoon library by following the same steps as I provided previously and it will be appended to the OpenIconic set too.

    hi – we’re having trouble with the ‘vela slideshow’ – ‘enable slideshow’ is ticked, ‘1st active image’ is ticked – an image is uploaded exactly matching that in vixka themes>vela-vixka_home4>assets (slideshow1.jpg) but all we get is grey rectangle with your circle+blue loading animation.

    Please contact us from the account that purchased this theme to make sure you’re currently in the correct product page that corresponds to what you have purchased.

    by
    by
    by
    by
    by
    by

    Tell us what you think!

    We'd like to ask you a few questions to help improve ThemeForest.

    Sure, take me to the survey