Я пытаюсь решить проблему, связанную с тем, как анимировать шрифт в удивительных строках меню, чтобы переключать клики.
Я не смог, но, чтобы обойти это, я создал файл в моя папка темы и называется она Menu Bars. В этот файл я поместил следующий код:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport"
content="width=device-
width, initial-scale=1">
<style>
.container {
display: inline-block;
cursor: pointer;
}
.bar1, .bar2, .bar3 {
width: 35px;
height: 5px;
background-color: #333;
margin: 6px 0;
transition: 0.4s;
}
.change .bar1 {
-webkit-transform:
rotate(-45deg)
translate(-9px, 6px);
transform: rotate(-45deg)
translate(-9px, 6px);
}.change .bar2 {opacity:
0;} .change .bar3 {
-webkit-transform:
rotate(45deg)
translate(-8px, -8px);
transform: rotate(45deg)
translate(-8px, -8px);
}
</style>
</head>
<body>
<div class="container"
onclick="myFunction(this)">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<script>
function myFunction(x) {
x.classList.toggle
("change");
}
</script>
</body>
</html>
Затем я посмотрел в своем заголовке. php и заменил <i class="fa fa-bars"></i> на
<?php header("Location:
home/qpgteouc/public_
html/wp-
content/themes/shapel
y/Menu"); ?>
Я предполагал, что это перенаправит на это файл `Menu Bars in location:
home/qpgteouc/public_
html/wp-
content/themes/shapel
y/Menu
и выполните файл, создавая анимацию полос меню, которую я хочу.
На самом деле произошло то, что сайт отказался загружаться по причине too many redirects.
Возможно ли то, что я пытаюсь сделать, и если да, то что мне нужно делать?
Вот что я имею после полезных советов, но все еще не работает.
<header id="masthead" class="site-
header<?php echo get_theme_mod(
'mobile_menu_on_desktop', true ) ? ' mobile-menu' : ''; ?>" role="banner">
<div class="nav-container">
<nav <?php echo $style; ?> id="site-navigation" class="main-navigation" role="navigation">
<div class="container nav-bar">
<div class="flex-row">
<div class="module left site-title-container">
<?php shapely_get_header_logo(); ?>
</div>
<div class="module widget-handle mobile-toggle right visible-sm visible-xs">
<?php require("home/qpgteouc/public_html/wp-content/themes/shapely/Menu_bars_"); ?>
</div>
<div class="module-group right">
<div class="module left">
<?php shapely_header_menu(); ?>
</div>
<!--end of menu module-->
<div class="module widget-handle search-widget-handle hidden-xs hidden-sm">
<div class="search">
<i class="fa fa-search"></i>
<span class="title"><?php esc_html_e( 'Site Search', 'shapely' ); ?></span>
</div>
<div class="function">
<?php
get_search_form();
?>
</div>
</div>
</div>
<!--end of module group-->
</div>
</div>
</nav><!-- #site-navigation -->
</div>