Hello,
I’m getting error if I try to create or update a page. Console says:
[Error] Failed to load resource: the server responded with a status of 500 ()
https://lolyo.local/wp-json/wp/v2/pages/30264?_locale=userIf page is set to private (instead of public) or YOAST plugin (Version: 23.9) is disabled, this error doesn’t occur.
I made a lot of tests and it turned out that this problem is with custom PHP block. So YOAST and this custom block seems to make problems. Here’s the code of the block:
<div class="gruenBg innerpadding">
<div class="container">
<div class="row mb-5">
<div class="col-12 text-center">
<?php
the_field('home-23-magische-zahlen-einleitung');
$home_23_wert_1 = get_field('home-23-magische-zahlen-wert-1');
$home_23_wert_2 = get_field('home-23-magische-zahlen-wert-2');
$home_23_wert_3 = get_field('home-23-magische-zahlen-wert-3');
?>
</div>
</div>
<div class="row magischeZahlen counter text-center">
<div class="col-md-4">
<div class="single-chart mb-4">
<svg viewBox="0 0 36 36" class="circular-chart orange">
<path class="circle-bg"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<path class="circle"
stroke-dasharray="<?php echo $home_23_wert_1; ?>, 100"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<text x="18" y="20.75" class="percentage count"><?php echo $home_23_wert_1; ?></text>
</svg>
</div><p><?php the_field('home-23-magische-zahlen-content-wert-1'); ?></p>
<?php
if( get_field('home-23-magische-zahlen-hinweis-1') ):
?>
<p class="hinweistext"><?php the_field('home-23-magische-zahlen-hinweis-1'); ?></p>
<?php endif; ?>
</div>
<div class="col-md-4">
<div class="single-chart mb-4">
<svg viewBox="0 0 36 36" class="circular-chart orange">
<path class="circle-bg"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<path class="circle"
stroke-dasharray="<?php echo $home_23_wert_2; ?>, 100"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<text x="18" y="20.75" class="percentage count"><?php echo $home_23_wert_2; ?></text>
</svg>
</div>
<p><?php the_field('home-23-magische-zahlen-content-wert-2'); ?></p>
<?php
if( get_field('home-23-magische-zahlen-hinweis-2') ):
?>
<p class="hinweistext"><?php the_field('home-23-magische-zahlen-hinweis-2'); ?></p>
<?php endif; ?>
</div>
<div class="col-md-4">
<div class="single-chart mb-4">
<svg viewBox="0 0 36 36" class="circular-chart orange">
<path class="circle-bg"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<path class="circle"
stroke-dasharray="<?php echo $home_23_wert_3; ?>, 100"
d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831"
/>
<text x="18" y="20.75" class="percentage count"><?php echo $home_23_wert_3; ?><text>
</svg>
</div>
<p><?php the_field('home-23-magische-zahlen-content-wert-3'); ?></p>
<?php
if( get_field('home-23-magische-zahlen-hinweis-3') ):
?>
<p class="hinweistext"><?php the_field('home-23-magische-zahlen-hinweis-3'); ?></p>
<?php endif; ?>
</div>
</div>
</div>
</div>
<?php
function lolyo_home23_zaehler() {
?>
<script type="text/javascript">
$(document).ready(function () {
// zaehler
$(function($, win) {
$.fn.inViewport = function(cb) {
return this.each(function(i,el){
function visPx(){
var H = $(this).height(),
r = el.getBoundingClientRect(), t=r.top, b=r.bottom;
return cb.call(el, Math.max(0, t>0? H-t : (b<H?b:H)));
} visPx();
$(win).on("resize scroll", visPx);
});
};
}(jQuery, window));
var prefix = " %";
jQuery(function($) { // DOM ready and $ in scope
$(".count").inViewport(function(px) { // Make use of the px argument!!!
// if element entered V.port ( px>0 ) and
// if prop initNumAnim flag is not yet set
// = Animate numbers
if(px>0 && !this.initNumAnim) {
this.initNumAnim = true; // Set flag to true to prevent re-running the same animation
$(this).prop('Counter',0).animate({
Counter: $(this).text()
}, {
duration: 2000,
step: function (now) {
$(this).text(parseFloat(now.toFixed(0))+prefix);
}
});
}
});
});
// /zaehler
// Animation im Viewport
function isScrolledIntoView(elem) {
var docViewTop = $(window).scrollTop();
var docViewBottom = docViewTop + $(window).height();
var elemTop = $(elem).offset().top;
var elemBottom = elemTop + $(elem).height();
return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}
$(window).scroll(function (e) {
$('.circle').each(function () {
if (isScrolledIntoView(this) === true) {
$(this).addClass('circleAnimation');
}
});
});
// /Animation im Viewport
});
</script>
<?php
}
add_action( 'wp_footer', 'lolyo_home23_zaehler' );
?>
Problem seems to make the bottom part (highlighted bold). I tried removing and saving/updating works. I also tried to remove the whole JS (<script></script>), error is still there 😒
Any tip would be very appreciated!
Kind regards
René
The page I need help with: [log in to see the link]