Important notice: we will respond to all open ticket requests up until November the 1st. After this date, we will be unable to process the ticket requests here on Ticksy.

Okay
  Public Ticket #1516301
Custom CSS
Closed

Comments

  • themool started the conversation

    Hi I am trying to change the sidebar BG from white to black. I also don't want the drop shadow / feathering around the sidebar, so need coding to remove that. 

    I then also want my navigation to have no BG and the font be in white please. Please advise ho to do this.

    REF attached. 

    Thanks T  

  • themool replied

    Also, PS, sorry. I would like the sidebar to be less wide (I have it on 1/4 already). Please see attached REF. Is it possible to reduce the width please advise.

    Thanks T 

  •   themool replied privately
  • themool replied

    PS, SORRY again...I also need to know how to change the scroll arrows CSS style please...I don't want stark white, I might want it black with a transparency with a lighter small arrow, or something like that. Please advise where and what coding I can use here (or where in the CMS settings I can find the arrows please). Thanks so much! T

  • themool replied

    Hi I managed to change the widget / sidebar BG colour and remove the feathering, so please ignore those requests. Also ignore the navigation question. 


    Can you please however still get back to me about (REF below):

    - scroll arrows CSS style please

    - sidebar to be less wide (OR how do I do the slider full width - aka have no sidebar). If I select 'no sidebar' on my page settings it messes everything up...

    Thanks T

  •  1,845
    Elated replied

    Hello there,

    1. Go to Elated Options>>General> Custom CSS and you can add something like this to your code.

    .eltd-blog-carousel.eltd-slider .eltd-blog-slide-arrow .eltd-next-icon-holder .eltd-next-icon-triangle, .eltd-blog-carousel.eltd-slider .eltd-blog-slide-arrow .eltd-next-icon-holder .eltd-prev-icon-triangle, .eltd-blog-carousel.eltd-slider .eltd-blog-slide-arrow .eltd-prev-icon-holder .eltd-next-icon-triangle, .eltd-blog-carousel.eltd-slider .eltd-blog-slide-arrow .eltd-prev-icon-holder .eltd-prev-icon-triangle {
        background-color: #000;
    }
    .eltd-blog-carousel.eltd-slider .eltd-blog-slide-arrow .eltd-next-icon-holder span, .eltd-blog-carousel.eltd-slider .eltd-blog-slide-arrow .eltd-prev-icon-holder span {
        color: #fff;
    }
    

    If you want some other colors, first one (background color) is for the color of the triangle and second one is for color of the arrow. You can set whatever you like. 

    2. Sidebar is defined like that and changing it you can mess up some other post you created. 

     Hope it helps!


    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  • themool replied

    Thanks for below that worked :) 

    I have a few minor styling issues I hoped you could help with as well as mobile responsive issues. It displays fine on desktop but the tablet and mobile view isn't working very well. I will explain with screenshots. thanks so much T 


    DESKPTOP 

    1. there is a white space under the content (where the footer would have been). I have tried changing the colour of the page, footer and bg areas but none worked. Please advise where I can set this colour? I want it to be #000209 like the rest of my page's BG...

    2. I would like to add a linked in image (linked to my linked in profile) after my phone number in the menu...Is this possible? If yes please advise how. 

    3. Id like the spacing ('a', 'b' and 'c') to be equal, lets say 80px. I did manage to adjust this by adding page padding in but the padding then messes with the other responsive views (especially the mobile view). Is there a better way to do this? Id also like the 'Art Direction' widget to move over more to the right (and not display on mobile view). I would like it displayed on tablet view but it cuts overlaps (see TABLET.jpg) Where are your responsive hide/show options in the CMS please? 

    MOBILE VIEW (see MOBILE.jpg)

    The mobile view cuts off the edges of the slider quite a bit...There is then also the issue of the page padding I created....Its now creating a massive open, unnecessary space above the slider and the image is off center (also due to the padding I assume). SO is there any way we can place the slider better, so that the padding is equal on desktop view, tablet view AND mobile view please. I also need the slider to scale down a bit more so that the sides don't cut off obviously. 

    Please assist soonest as the site is live. Thank you T 


  • themool replied

    sorry and tablet.jog attached FYI

  •  1,845
    Elated replied

    Hello there,

    1. You can add height to the footer for example. Go to Elated Options>>General>>Custom CSS and paste this code:

    .home footer.eltd-disable-footer {
        display: block;
        height: 374px;
    }
    @media only screen and (max-width: 600px){
        footer.eltd-disable-footer {
            display: block;
            height: 74px;
        }
    }
    

    2. Go to Elated Options>>Social Networks and enable Linkedin share https://www.screencast.com/t/zFMH0cdKV

    3. For every element that is set in here (slider and sidebar in your case), you can set paddings for every screen sizes. for example https://www.screencast.com/t/sNxEQJRCGWR . You can set slider and sidebar in Element Holder and Element Holder Item and then set paddings for Element Holder Item. 

    4. Like we said above, this options are for tablet and mobile screens, so there you can manipulate also for mobile view.



    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  • themool replied

    Thanks for below but it didn't really work. There is still a white space in the footer (ref attached). I did activate the LI option but it does not show (ref attached). Also re point 3 - I don't get that panel...All I get is attached. Please advise how you got to that? Ref attached of what I can see. I have always though there is an error in my installation (if you refer back to my original support emails to you) as I have never been able to view the page builder section...Please advise soonest, or even better if you can go in and have a look (and fix if its easy). Thanks so much T Ill post my login below

  •   themool replied privately
  • themool replied

    Re the error in installation please refer to attached, I have never been able to update it, please can you do it for me? It might solve a lot of problems...Thanks T 

  •  1,845
    Elated replied

    Hello there, 

    Sorry for waiting the answer this much, it's caused because of the weekend days.

    About the WPBakery, that is perfectly normal. Bundled plugins can only be included when author purchase commercial license and that is the case here, but this license cannot be given to end users because they will be able to use included plugin on all other installations without needing to purchase it separately so this is normal and according to Theme Forest terms https://help.market.envato.com/hc/en-us/articles/213762463-Bundled-Plugins?_ga=2.245886596.1068361229.1494855372-1438803025.1429707923 . When the new update of the theme come out, WPBakery will be updated too. Don't worry, this is not causing any problems.

    We can not access your dashboard with this credentials, for some reason.

    1. Add this code to your Custom CSS

    .home .eltd-full-width {
        height: 100vh;
    }
    

    2. Also, you have to set widget to the right side of the menu. https://www.screencast.com/t/3p64yQy16iF Choose some icon pack, target (to open in new window), set link to your profile. If you are choosing Font Elegant icon pack, choose Font Elegant icons and so on. 

    3. That's because you chosen columns settings. Down bellow we suggested to set item in Element holder. Please provide us correct credentials if you can not solve this last issue.


    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  •   themool replied privately
  •  1,845
    Elated replied

    Hello there,

    1. We set this for you. This piece of code we added to Appearance>Customize>Additional CSS: 

    body{
     height:100%;
    }
    .eltd-wrapper {
        height: auto;
        min-height: 100%;
        background-color: #000209;
    }
    

    2. For Font Elegant you have to choose Font Elegant Icon as you can see here https://www.screencast.com/t/EXTUBgcU

    For some reason we can not reach your site https://www.screencast.com/t/gwNKYvXyH anymore, so we can not take a look at the issue number 3. Let us know when it's fixed so we can continue. Thanks!


    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  •   themool replied privately
  • themool replied

    Hi there any news re my previous mail? 

    Also, the mobile view with the slider is not working for me - it doesn't fit properly and the images are too small Id rather have the images tile one below the other for mobile view. Is there any way we can use css to detect a mobile device, then redirect to a different page (http://brandboard.co.za/split-flow/bb_hello_m/)? Please can you assist. 

    I also don't want the /split-flow/ section in the link how do I remove that please? 

    Thanks T

  •  1,845
    Elated replied

    Hello there,

    Sorry for late response. We had a few days off because of the national holiday.

    As you can see in this video, there is no additional menu and you can not scroll https://www.screencast.com/t/wzJ2hlg2Q7. We logged in with your credentials and we can not find that menu that you recorded. It is set not to be moveable. 

    Try to deactivate all of your plugins to make sure they are not causing this issue. If the issue goes away, then you can enable them one by one to find out which one is causing the issue. If you still have issues after you have deactivated all of your plugins, please provide a temporary admin login and URL to your site and I’ll take a look.

    Linkedin icon: You have to set widget right from the main menu, not sidebar https://www.screencast.com/t/pgfKWPbse7



    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  • themool replied

    Hi there, thanks for below. I did add the widget where suggested and all it did was add a small black space right of the white header / menu section. Still no LI logo or link. Please assist. 

    Also, please urgently get back to me re my mobile view question 5 hours ago. Many thanks T 

  •  1,845
    Elated replied

    Hello there,

    You need to set only Font Elegant Icon https://www.screencast.com/t/4Z6FLXGI. Also, widgets have background color, and it's black and that's why you have little rectangle in the right side of the menu. That is because the Linkedin icon is here, but widget is black. 

    We deleted this (.page-id-3500 .widget { background: #000209; box-shadow: none; } and so on), because that was causing the trouble with that background color (right side of the menu on every page) and added this so the background color of the side menu will be black:

    .widget_text.widget-odd.widget-last.widget-first.widget-1.topmargin.widget.widget_custom_html {
        background-color: #000!important;
    }
    

    Also, we set some padding for the icon:

    .widget.eltd-social-icon-widget-holder {
        padding: 0 20px;
    }
    

    About mobile version of the image gallery, it can not be set different gallery type. You can set Image grid https://www.screencast.com/t/6yIc5WdJS, but it will be on the desktop and mobile versions of the site.


    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  • themool replied

    thanks for that, LI now works. 

    Re the mobile view, what I am asking is, can we use css to detect as smaller screen (tablet and mobile) and then redirect to another page (not my home page for desktop). I understand it wont be fully responsive then as the mobile pages would be separate to the desktop pages but I would prefer having the two versions so that I can control better how mobile displays. If you have a look on your phone the images are very small and displays are a mess with scroll arrows overlapping and images cutting off. I unfortunately don't have the full version of WP bakery as you know so have no way of adjusting it. Please send fix or alternate suggestions

    Thanks T 

  •  1,845
    Elated replied

    Hello there,

    This can not be achieved, to redirect to another page when you are on the mobile. You can only change the image size when you click on the image width some Custom CSS:

    @media only screen and (max-width: 900px){
      body div.pp_default .pp_expand {
      display: none !important;
      }
      div.pp_pic_holder {
      width: 75% !important;
      left: 10% !important;
      }
      body div.pp_default .pp_content {
      width: 100% !important;
      height: auto !important;
      }
      .pp_hoverContainer {
      width: 100% !important;
      height: 100% !important;
      }
      div.pp_default .pp_details {
      width: 100% !Important;
      }
      .pp_content #pp_full_res>img {
      width: 100%!important;
      height: auto!important;
      }
    }
    

    Since script will determinate light box position, it will change when you scroll further down. Unfortunately script author didn't release fix for this yet. 


    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.