Problem in URL after scroll down arrow - Support | Kriesi.at

Viewing 21 posts - 1 through 21 (of 21 total)

Author

Posts
September 5, 2017 at 11:36 am #848050

giaco_he
Participant

Hey guys,

a few days ago I postet the following problem:
https://kriesi.at/support/topic/down-arrow-2/#post-847841

The down arrow now works, however, when you click on it the URL changes from https://edley.de to https://edley.de/#after_section_1 which is not supposed to be like this at all. Please help.

Thanks.

September 5, 2017 at 11:59 am #848054

tjswarbs78
Participant

Hi,

You can add an ID to the color section that the arrow scrolls to.
If you add the ID of Kursbereiche the url will then be https://edley.de/#Kursbereiche

Hope that helps a little

TJ

September 5, 2017 at 12:14 pm #848066

giaco_he
Participant

Hi,

thanks. But do I have to add an ID to the color section? Can’t I just have it still be https://edley.de ?

Thanks again!

September 5, 2017 at 12:26 pm #848078

tjswarbs78
Participant

Hmmm,

I may be wrong but I’d say no, a mod may know better though.

Most elements have an ID in order for certain elements / functions to work. By default sections are structured on your site as follows…

id full_slider_1
id arrow1
id after_section_1
id av_section 2
id after_section_2
id av_section_3
id after_section_3

The arrow you created is set to scroll to the next section anchor it sees which is after_section_1 hence why the ID appears in your url. The arrow needs an ID to look for. If no ID (anchor) was set all that would happen is the arrow would keep re loading the page rather than scrolling down

TJ

September 5, 2017 at 12:28 pm #848079
giaco_he
Participant
Hi,

what about not making the down arrow ‘clickable’? I just want people to see that they can scroll down. Doesn’t have to scroll down to the next section automatically when clicking. The down arrow should just be there (would even prefer it not moving up and down).

Thanks!
- This reply was modified 7 years, 2 months ago by giaco_he.
September 5, 2017 at 12:48 pm #848093

tjswarbs78
Participant

Hey,

If you only want an arrow to represent there is more below how about just adding a little png of an arrow below the button?
You could remove the section with the current arrow in it altogether then

TJ

September 5, 2017 at 12:50 pm #848094

giaco_he
Participant

Yeah that would be best but how do I add the png on the full screen slider? Haven’t figured that out yet.

Thank you

September 5, 2017 at 1:12 pm #848095
tjswarbs78
Participant
Hmm,,

Actually there should be an option under the full screen slider settings to “Display a scroll down arrow”

You can then use some css to turn off the click event and stop the animation
```
.avia-fullscreen-slider .scroll-down-link {
    pointer-events: none;
    animation:none;
}
```
Failing that you could use a css pseudo class to attach an image after the button

TJ
September 5, 2017 at 1:16 pm #848096
giaco_he
Participant
Hey,

actually I’m not sure if it is a ‘full screen slider’.. in German it is called ‘Slide-Show (volle Breite)’ which would maybe translate to ‘Slide-Show (full width)’. But there is no option to add a scroll down arrow.

So adding a PNG under the button is not possible?

Best,

Giacomo
- This reply was modified 7 years, 2 months ago by giaco_he.
September 5, 2017 at 2:21 pm #848119
tjswarbs78
Participant
Ok.

Lets try this…
```
.page-id-45 .avia-caption-content:after {
    content: '';
    position: absolute;
    margin-top: 100px;
    left: 41%;
    height: 100px;
    width: 200px;
    background-image: url(https://edley.de/wp-content/uploads/2017/04/Logo-f%C3%BCr-Website-schwarz-300x134.png);
    background-size: cover;
}
```
You’ll need to change the image url to a png from your media library.
That will add an image below the button… in this example your logo

It may need a tweak once you have the image you want in place.

TJ
September 5, 2017 at 3:16 pm #848142
giaco_he
Participant
Thank you very much, that worked. Now I just need to find out how to align it in the middle and make it responsive for all devices, but I’ll figure that out.

Thanks again!
- This reply was modified 7 years, 2 months ago by giaco_he.
September 5, 2017 at 3:22 pm #848148

tjswarbs78
Participant

You are welcome.

The height and width values can be changed. I had to use those to get the logo to sit correctly.
The left 47% can be changed to move the arrow left or right.

Have a play with the figures until you get it just right

Thanks

TJ

September 6, 2017 at 2:29 pm #848656

Victoria
Inactive Moderator

Hi giaco_he,

I see you’ve got great help here :)
Thank you TJ.

However, I do not see the scroll down arrow and do see an error in JavaScript.

Do you still need our help or you got things working for you?

Best regards,
Victoria

September 6, 2017 at 2:55 pm #848673

giaco_he
Participant

Hi both,

thank you TJ! The solution TJ suggested worked but I didn’t manage to align it in the middle on all devices. But no worries, I decided to to it without an arrow and instead change the image height so that it’s clear that the website is scrollable.

What is the JavaScript error about and how can it be solved?

Thanks,

Giaco

September 7, 2017 at 10:09 am #848995

Victoria
Inactive Moderator

Hi Giaco,

The error is in this script:

View post on imgur.com

It’s from wpemoji, you decide what to do with it.
Best regards,
Victoria

September 8, 2017 at 3:56 pm #849612

giaco_he
Participant

Hi Victoria,

yes I actually got a customer complaining, saying that he can’t pay with credit card and that on the checkout page it always says “Please enter your card details to make a payment. Developers: Please make sure that you are including jQuery and there are no JavaScript errors on the page.”

I searched a little bit and found this link https://docs.woocommerce.com/document/stripe/
so I think the error on the checkout page is related to the JS error. I know that the checkout page is managed by WooCommerce but nevertheless it runs on the Enfold theme. Could you maybe help me on how to get rid of the error? Or maybe just have an idea what to do? I am not a developer so I’m thankful for every bit of help!

Kind regards,

Giacomo

September 11, 2017 at 3:07 am #850280

Ismael
Moderator

Hi,

The error doesn’t look related to the stripe plugin. We tried to access the site but the login credentials are not working.

Best regards,
Ismael

September 11, 2017 at 3:09 am #850281
giaco_he
Participant
Hi Ismael, try again with the new password please.
- This reply was modified 7 years, 2 months ago by giaco_he.
September 12, 2017 at 7:20 am #850788
Ismael
Moderator
Hi,

The error is from the following script.
```
<script>
jQuery(document).ready(function($){
    $('.form-outofstock-button').click(function(){
        $('.form-outofstock-popup').show();
    });
    $('.button-close').click(function(){
        $('.form-outofstock-popup').hide();
    });
	
	var videoyt = $('#tab-description iframe[src*="youtube"]')[0].src;
	$('#tab-description iframe[src*="youtube"]').hide();
	if(videoyt != '') {
		$('#tab-description iframe[src*="youtube"]').parents('.product').find('.images').append('<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#popvideo">Open video</button>');
		$('#tab-description iframe[src*="youtube"]').parents('.product').find('.images').addClass('hasvideo');
		var iframepopup = '<iframe  id="video1" src="'+ videoyt +'" width="900" height="500" frameborder="0" allowfullscreen="allowfullscreen"></iframe>';
		var contentpopup = '<div class="modal fade" id="popvideo" role="dialog"><div class="modal-dialog"><div class="embed-responsive embed-responsive-16by9">'+iframepopup+'</div></div></div>';
		$('#tab-description iframe[src*="youtube"]').parents('.product').append(contentpopup);	
	}
	
	
	$("#popvideo").on('click',function(){
	  $("#video1")[0].src = $("#video1")[0].src.replace("&autoplay=1", "");
	  //$(this).unbind("click");//or some other way to make sure that this only happens once
	 });
	
	$(".btn.btn-info.btn-lg").on('click',function(){
	  $("#video1")[0].src += "&autoplay=1";
	  
	});
	
});
</script>
```
This line:
```
var videoyt = $('#tab-description iframe[src*="youtube"]')[0].src;
```
Where did you get it?

Best regards,
Ismael
September 12, 2017 at 11:13 am #850948

giaco_he
Participant

Hi, can you tell me in which file the error is located?

I hired a freelancer to do that..

Best,

Giaco

September 13, 2017 at 6:57 am #851390

Ismael
Moderator

Hi,

It’s directly added in the footer.php file which is not recommended. Please upgrade the theme from 4.0.5 to version 4.1.2 then move it to a child theme.

// http://kriesi.at/documentation/enfold/using-a-child-theme/

Please contact the previous freelancer for more info.

Best regards,
Ismael
Author

Posts

Viewing 21 posts - 1 through 21 (of 21 total)

You must be logged in to reply to this topic.