Okay
  Public Ticket #283851
Removing buttons and icons/reposition button on Home page
Closed

Comments

  • Ross started the conversation

    I would like to remove the audio button on the home page. I managed to find it and delete it from the Main style sheet but a small speaker icon now appears at the top. Also, I have removed the scrolling text on the main page. By doing so, the button that links into the site now is dead center over my logo. Is there a way to reposition that button?

    Thanks,

    Ross

  • Chris replied

    I removed the mute button from the home_section_parallax_video.php

    When editing your home page try adding [& n b s p ;] without the brackets and not spaced, above the code for the button. If you need another space down add like this

    [& n b s p ;]

    [& n b s p ;]

    And so on.

    I'm not an admin but hopefully that will help. 

  • Chris replied

    The only reason I spaced the letters [& n b s p ;] and placed them in brackets is they did not display the first time I posted a response. 

  • Ross replied

    Tx. but where in the code do I insert   ? I assume this is still the home_section_parallax_video.php. Also there is still small grey mute button top center.

  • Ross replied

    [& n b s p ;] - did not make it into last post; )

  • Chris replied

    For the video mute button I removed the line of code <i class="fa fa-volume-down"> 

    Always make a copy of any code before you change it of course. 

    As I look at your home page I see you don't have a video rinning so maybe that code is actually somewhere in the HOME page code. So go to pages and select HOME to see the code there. 

    While there see if the code for the button is there too and if so just add the code I suggested above it. 

    If it is not there taking a guess here but try adding to your custom css (which you can find under Appearance/theme options)

    .newave-button medium outline white[

    margin-top:300px;

    ]

    If it moves the button at all you should then be able to adjust the height by changing the number of px in that code

    Hope that helps. 

  • Ross replied

    This did not work. This may be because I have 2 other bits of code to address 2 other issues: removing the pattern overlay on the video screen and telling Chrome the width of my logo for my header, as it as disappearing in the Chrome browser. Here is what I have:

    .pattern {

    background: none;

    }

    #logo {

    width: 143px;

    }

    Where in the custom CSS would I add the code you suggest to move the button down?

    Thanks for all your help.

    Ross

  • Chris replied

    Here is a screenshot of the code I removed and the page (just the bit highlighted in red). Not sure if that will help but let me know. When I checked the elements on your page it read the same so here is hoping. 

    Just going to look at some code in my backend to see if I can work out how to move your button. 

  • Chris replied

    That is to remove the mute icon. As long as you have a backup saved you could probably remove that entire line of code too. 

  • Chris replied

    Ok we are partly there. at the moment I can only move it left or right but i'll give you the code to test at your end. 

    It won't matter where in the custom css it is so just drop it in above or below the other code. I just have a float right command in there now which we will replace with whatever we need to adjust the height. Not sure why that is alluding me but at least we know the button can be moved.

    a.newave-button.medium.outline.white {

    float: right;

    }

  • Chris replied

    Ok this should be it. 

    a.newave-button.medium.outline.white {

    position: absolute;

    left: 50%;

    bottom: 70px;

    }

    Obviously you can just adjust the percentage left and the height from the bottom. 

    Just check how it looks on mobile devices. It may well be a good idea to do the bottom as a percentage as well.

  • Ross replied

    TY! We are dangerously close! Iwould however like the button to remain centered as the window resizes just as the video remains centered.

    Imagine the button doing exactly what it did before the code was added but is only offset down by 100-150px. That way it would reposition and remain centered under the logo and

    above the fly-on text.

    Perhaps this is a scaling command?

    Do you have a fix for that?

    This is amazing technical support BTW!

    Ross

  • Chris replied

    I'll have a look. 

    Just to let you know i'm not support hence my warning to back up code. I would hate to offer advice and find someone is then missing essential code from their site. I just love the theme too. 

  • Chris replied

    I have to head out but if this does not work i'll take another poke tomorrow. 

    a.newave-button.medium.outline.white {

    display: inline-block;

    margin-left: auto;

    margin-right: auto

    position: fixed;

    left: 50%;

    margin-top: 8%;

    max-width: 100%;

    }

    Just adjust the margin-top percentage until you get the space you need. 

  • Ross replied

    You rock! This will do it.

    MUCH THANKS!

    Ross

  • Chris replied

    Great stuff. 

  • Ross replied

    BTW-do you know if you can make multiple portfolios? I would like to separate out my video and audio production portfolios.