Navigation

This content is old and no longer supported. You may use at your own risk, but no official support will be provided for anything listed here. If you are a Themeco customer, we invite you to check out our new community and forums, Apex.

Tagged: 

  • Author
    Posts
  • #1373830

    coachinguplifting
    Participant

    Hi Support,

    I am having a hard time, aligning the marginless columns and making them responsive on my website http://www.upliftingcoaching.com
    The columns are under the title “Our Services”.

    Now I have added the Movie icon with the text – “Remove” to make a visual representation on how I want it to look, but aligned and responsive with this icons removed (with the text remove).

    I was hoping you guys could help me out, I am really having a hard time on how to do this.

    Regards,

    #1374066

    Joao
    Moderator

    Hi THere,

    Can you provide a screenshot of what you are trying to fix? You can resize your browser to take a screenshot

    I checked your page and I am a bit confused, Also I did not find “Movie icon with the text – “Remove” to make a visual representation on…”

    Let us know more details,

    Thanks

    #1374142

    coachinguplifting
    Participant

    I marked the icons that I added to allign the website in red. I only added these icons, because I couldn’t get the 3 marginless windows to have the same lay out, in particular the images and the text:

    “You will have 24/7 access to us via Email and Whatsapp for any questions/concerns you have.
    We have a 24-hour response time guarantee!”

    Is there a way to do it.

    I also marked the miss alignment in yellow

    Attachments:
    You must be logged in to view attached files.
    #1374600

    Lely
    Moderator

    Hi There,

    Thank you for the clarification.
    Let’s separate the content. We will use two text element instead. The top one will contain all you content until the icons. Then below it, add another text element, this time the content will be just this:

    You will have 24/7 access to us via Email and Whatsapp for any questions/concerns you have.
    We have a 24-hour response time guarantee!

    On the top text element class field, add same-height. Do this on text element for the next 2 columns. You may now remove those Icon and text remove. Now, add this script on Settings Tab > Custom JS:

    jQuery(document).ready(function($) {
    	var max = 0;
    	$(".same-height").each(function(index, el) {
    		if( $(this).height() > max ){
    			max = $(this).height();
    		}
    	});
    	$(".same-height").css('height', max);
    });

    The code will get each of the top text element height. Check which one has the maximum height and then set it back to every text element.

    Hope this helps.

    #1374757

    coachinguplifting
    Participant

    I tried, but I don’t get how to do it, i made a copy below the original and tried it out, but I don’t know how to do the last part.

    Could you help me by logging in and making the changes?

    #1374992

    Lely
    Moderator

    Hi There,

    Please check attached screenshot for the setup. Then add the script on Settings Tab > Custom JS:.
    If this still doesn’t work, please share your admin credentials on a private reply.

    Attachments:
    You must be logged in to view attached files.
    #1375038

    coachinguplifting
    Participant

    Lely, your the best it worked!

    I have 2 more questions, that I still need to resolve.

    1. How can I do the same for the tiles under the title, “How does it work”, now the text is pretty similar but it will change and the sizes of the tiles will to.
    2. In the One Page Navigation. The headers of the Menu links are greyed out with a red bar above them. I would not like them greyed out with the red bar above it, is it possible?

    Let me know, many thanks for the support.

    #1375688

    Rad
    Moderator

    Hi there,

    1. It will be tricky since it’s a flip card and it has its own dimension. Please add this CSS,

    .x-card-outer .x-face-text {
        margin: 8px 0 0;
        min-height: 200px;
    }

    2. Please add this too

    .x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
        box-shadow: none;
    color: #000;
    }

    Hope these helps.

    #1376482

    coachinguplifting
    Participant

    Edit – It worked, many thanks!

    #1376775

    Rad
    Moderator

    You’re welcome!

    #1379692

    coachinguplifting
    Participant

    Hey Rad,

    I have yet another question relating to responsiveness. This time it’s the revolution slider. When viewing it on mobile device the text and image don’t adjust properly and look kinda weird.

    url: http://www.upliftingcoaching.com

    uploaded a image as well.

    Attachments:
    You must be logged in to view attached files.
    #1379752

    Paul R
    Moderator

    Hi,

    Please note that you can adjust the size and re-position your layers base on screen width in revslider.

    Refer to the link below for your guide.

    https://www.themepunch.com/revslider-doc/slide-layers/#layercanvas

    Thanks

    #1381405

    coachinguplifting
    Participant

    Yes this helped!

    I also changed the icons for windows and apple phones, under appearance – site icons. But they don’t seem to work.
    Could you check why?

    #1381965

    Rad
    Moderator

    Hi there,

    Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

    – Link to your site
    – WordPress Admin username / password
    – FTP credentials

    Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

    For the meantime, please clear your server cache, and your browser’s cache. I checked the source code and I don’t see any icons.

    Thanks!

    #1382786

    coachinguplifting
    Participant

    I waited another day, and now it solved itself!

Join Apex

This content is old and no longer supported. We invite you to check out our new community and forums, Apex.

Join Apex