Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #793045

    Hello,
    i need to use a tab title as a download link, but adding ” Download ” causes the tab title to be out of alignment.
    I tried commands like <center> … </center> but it does not solve the problem.
    If you need, you can access the web page in the private content.

    Is there a way to center this properly, or should i look for another way of adding that download link?

    Thank you very much

    #793090

    Hey Qgrafica_7,
    Did you add your link as the title? I just tested this and it worked good:

    <a href="http://www.....pdf" download="">Download</a>

    Can you please include a admin login in the private content area so we can take a closer look.

    Best regards,
    Mike

    #795099

    Hello,
    yes, this is exactly what i did.
    I’m adding the login information in the private content.

    Please refer to the page “test”

    Thank you very much

    #795324

    Hi,

    The tabs items must have the same alignment of the download link?

    Best regards,
    John Torvik

    #797538

    Hi,
    no, the download link must have the same alignment as the other tab items.

    They all appear centered vertically, the download link is not and it appears on the bottom right

    Thank you

    #797663

    Hi,

    You will be able to mimic the positioning by doing the following steps:
    1. Please use this as your tab title instead:

    <a href="YOUR LINK HERE" download="" class="av-section-tab-title av-tab-no-icon av-tab-no-image download-link">Download</a>

    This will make the download link take some of the other tabs’ styles. The last one is a new one that will use in step 2.

    2. Please add this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    #av-tab-section-1 .download-link { 
       margin: 7px 0 6px 0;
       vertical-align:top;
       line-height:2.5em;
    }

    You might also want to hide the empty tab title. To do this, please add this in Quick CSS as well:

    #av-tab-section-1 a[data-av-tab-section-title="7"] {display:none !important;}

    I hope that helps!

    Best regards,
    Sarah

    • This reply was modified 7 years, 6 months ago by Sarah. Reason: removed link
    #797736

    Thank you Sarah,

    i did everything you told me but it did worse:
    – I still see the “download” tab on the bottom right
    – Now the tab titles move together with the content
    – Now the content gets cutted

    Please see the page yourself, i’ll add the link in the private content. Feel free to enter with the WP account i created for you (see the informations in the private content i added a few answers ago)

    Thank you for your support

    #797790

    Hi! So sorry about that. I’ve updated my previous reply to have the correct instructions.

    I’ve also applied the changes, and if you check now, your tabs should appear nicely. Please do let us know if you encounter other problems.

    Best regards,
    Sarah

    #797798

    I’m giving a look at your edit right now,
    in the meantime can you please delete the personal information in your reply? like website name and pdf file name.
    It does not look like it’s private

    Thanks

    #797804

    Done! :)

    Best regards,
    Sarah

    #797819

    ok thank you very much :)

    I did everything you asked but i still have problems:

    – The download tab is now aligned correctly, but the link does not work (i won’t open the download window)
    – The tabs content still gets cut (inside a tab content i see a portion of the right tab content and a portion of the next one)

    #799320

    Hi,

    The tab title is already an anchor tag and you cannot add anchor tag inside another anchor. We removed the html markup in the tab title and then added the following script in a code block.

    <script>
    (function($){
    	function a() {
    		var download = $('.av-section-tab-title[data-av-tab-section-title="7"]');
    
    		download.on('click', function(e) {
    			e.preventDefault();
    			window.open(
    			  'YOUR LINK',
    			  '_blank'
    			);
    		});
    	}
    
    	a();
    })(jQuery);
    </script>
    

    Best regards,
    Ismael

    • This reply was modified 7 years, 6 months ago by Sarah.
    #799829

    Thank you very much Ismael, that’s what i needed!
    Can you please delete the personal information in your reply? like website name and pdf file name.

    And is it too much if i ask you if it’s possible to not actually open the tab when i click download?
    Like it is now, once i download the file, i’ll find an empty open tab.

    #800568

    Hi Qgrafica_7,

    You could try removing the “_blank” part.

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #801673

    I’m sorry to bother you Ismael, you didn’t delete the name of the pdf file in your reply. It would be great if you could kindly delete that information, thanks.

    By the way, if anyone else is encountering the same problem as me, i solved it adding this function: “window.location.reload();”

    here is the full code in the block of code:

    <script>
    (function($){
    function a() {
    var download = $(‘.av-section-tab-title[data-av-tab-section-title=”7″]’);
    download.on(‘click’, function(e) {
    e.preventDefault();
    window.location.reload();
    window.open(
    ‘http….(link of the file to download).’,
    );
    });
    }
    a();
    })(jQuery);
    </script>;

    Thank you for your support,

    have a good day

    • This reply was modified 7 years, 6 months ago by Qgrafica_7.
    #801766

    Hi!

    I redacted the link in this thread as requested. We’re glad that the link works as you want it now! Thank you for sharing your final code.

    Have a good day!
    Sarah

Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘Download link in "tab section" tab title’ is closed to new replies.