Соскальзывает форма подписки в хедере

(@ghostik)

Добрый день!

В шапке сайта стоит изображение и форма подписки. На широком экране,всё отображается корректно и вопросов нет.

Однако, когда половинишь браузер, форма убегает, а в мобильной версии вообще исчезает. Как это можно исправить,подскажите пожалуйста?

Код в шапке:

<?php
/**
* The Header for our theme.
*
* Displays all of the <head> section and everything up till <div id=”content”>
*
* @package Magnigenie
* @subpackage Geekery
* @since Geekery 1.0
*/
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset=”<?php bloginfo( ‘charset’ ); ?>”>
<meta name=”viewport” content=”width=device-width, initial-scale=1″>
<title><?php wp_title( ‘|’, true, ‘right’ ); ?></title>
<link rel=”profile” href=”http://gmpg.org/xfn/11″>
<link rel=”pingback” href=”<?php bloginfo( ‘pingback_url’ ); ?>”>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id=”page” class=”hfeed site”>
<?php do_action( ‘before’ ); ?>
<?php
// get sticky posts from DB
$sticky = get_option( ‘sticky_posts’ );
// check if there are any
if ( !empty( $sticky ) ) {
rsort($sticky);
}
if( is_front_page() && 1 == get_theme_mod( ‘geekery_slider’ ) && 0 < count( $sticky ) ) : ?>
<div id=”slider-wrap” class=”owl-carousel”>
<?php
$args = array( ‘post_type’ => ‘post’, ‘posts_per_page’ => 5, ‘post__in’ => $sticky );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div class=”item”>
<?php
if ( has_post_thumbnail() ):
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id(), ‘full’ );
$url = $thumb[‘0′];
?>
<?php
else:
$url= get_stylesheet_directory_uri() . ‘/images/default.jpg';
endif; ?>
<div class=”post-content”>
<h2><a href="”<?php">”><?php the_title() ?></a></h2>
<?php the_excerpt(); ?>
</div>
<a href="”<?php">”><img src=”<?php echo $url; ?>” alt=”<?php the_title_attribute() ?>”></a>
</div>

<?php endwhile; ?>
</div>
<?php endif; ?>
<?php $logo = get_theme_mod( ‘geekery_logo’ ); ?>
<header id=”masthead” class=”site-header” role=”banner”>
<div class=”header-wrap clearfix”>
<div class=”site-branding”>
<h1 class=”site-title”>
<a href="”<?php">” title=”<?php echo esc_attr( get_bloginfo( ‘name’, ‘display’ ) ); ?>” rel=”home”>
<?php if( $logo !=” ): ?>
<img src=”<?php echo $logo; ?>”>
<?php else: ?>
<?php bloginfo(‘name’); ?>
<?php endif; ?>
</a>
</h1>
<h2 class=”site-description”><?php bloginfo( ‘description’ ); ?></h2>
</div>
<nav id=”site-navigation” class=”main-navigation” role=”navigation”>
<h1 class=”menu-toggle”></h1>
<a href="”#content”"><?php _e( ‘Skip to content’, ‘geekery’ ); ?></a>
<?php wp_nav_menu( array( ‘theme_location’ => ‘primary’ ) ); ?>
</nav><!– #site-navigation –>
<div align=”center”><script type=”text/javascript” src=”//yastatic.net/share/share.js” charset=”utf-8″></script><div class=”yashare-auto-init” data-yashareL10n=”ru” data-yashareType=”none” data-yashareQuickServices=”vkontakte,facebook,twitter”></div></div>
</div><!– .inner-wrap header-wrap –>
</header><!– #masthead –>

<div id=”content” class=”site-content”>
<div class=”inner-wrap”>
<style type=”text/css”>
.temnyi {position: relative;}
.svetlyi {position: absolute; left: 628px; top: 254px;}
</style>

<div class=”temnyi”>
<p align=”center”>
<img src=”http://cj23481.tmweb.ru/wp-content/uploads/2015/04/Узалова41.png”/>
</p>
<div class=”svetlyi”>

<p align=”center”>
<div class=”jc_subblock_0 jc_subblocktexture_0″ id=”subscr-block-4132″>
<form action=”http://shop.rukijatuzalova.ru/subscribe/process/?rid%5B0%5D=podarok&rid%5B1%5D=weekmoney&rid%5B2%5D=book&lead_name=%D0%94%D0%BE%D1%80%D0%BE%D0%B3%D0%BE%D0%B9%20%D0%B4%D1%80%D1%83%D0%B3″ method=”post” target=”_blank” id=”subscr-form-4132″ onsubmit=”return jc_chkscrfrm(this, false, false, false, false)”><style type=”text/css”>@import url(‘http://shop.rukijatuzalova.ru/media/css/page_ext.css’);</style>
<style type=”text/css”>#subscr-block-4132 {
width:250px;
margin:0 auto;
padding:0px;
-webkit-border-radius:0px;
-moz-border-radius:0px;
border-radius:0px;
}
#subscr-form-4132 td {
font:normal 4px Arial,Helvetica,sans-serif;
text-align: center;
padding:0;
}
#subscr-form-4132 input.form-submit {
text-align: center ;
width: 250px;
}
#subscr-form-4132 #form-submit-4132 {
border:solid 1px #E0E0E0;margin-top:17px;
}
#subscr-form-4132 a.oferta {
color: #034795;
text-decoration: underline;
}
#subscr-form-4132 a.oferta:hover {
text-decoration: none;
}
#subscr-form-4132 a.jc_compile_btn, input.form-submit.jc_compile_btn {
border:solid 1px #E0E0E0;margin-top:0px;
}
#subscr-form-4132 a.jc_compile_btn span, #subscr-form-4132 input.form-submit.jc_compile_btn {
font:normal 15px Arial;
padding-top:0px;
margin-bottom:0px;
}
#subscr-form-4132 input[type=text] {
color:#000;
font-size:23px;
text-align:center;
-webkit-border-radius:1px;
-moz-border-radius:1px;
border-radius:1px;
border:#ccc 3px solid;
padding:0px 0px;
margin:1px 5px 10px 5px;
width:230px;
}
</style>
<table align=”left” border=”1″ cellspacing=”0″ cellpadding=”1″><tbody>
<tr>
<td><input name=”lead_email” type=”text” onblur=’if(this.value==””) this.value=”Введите ваш e-mail”‘ onfocus=’if(this.value==”Введите ваш e-mail”) this.value=””‘ value=”Введите ваш e-mail”/></td>
</tr></br><placeholder/>
<tr>
<td><input type=”submit” style=”color:#fff; width:230px; font-size:23px” value=”Беру бесплатно!” /></td>
</tr></tbody>
</table>
<script language=”JavaScript” src=”/media/subscribe/helper2.js.php”></script>
<script language=”JavaScript”>jc_setfrmfld()</script>
</form>
</div>
</div>
</div>
</p>

</nav><!– #site-navigation –>
</div><!– .inner-wrap header-wrap –>
</header><!– #masthead –>
<div id=”content” class=”site-content”>
<div class=”inner-wrap”>”

Просмотр 1 ответа (всего 1)

Roman
(@web911)

9 лет назад

когда половинишь браузер, форма убегает, а в мобильной версии вообще исчезает

Форма не убегает, она остаётся вместе с горизонтальной прокруткой, просто её не видно. У Вас несчастный, растерзанный полу- или псевдо- адаптивный шаблон 🙂

Как это можно исправить,подскажите пожалуйста?

Мой совет — подберите другую тему.

Просмотр 1 ответа (всего 1)

Тема «Соскальзывает форма подписки в хедере» закрыта для новых ответов.

Метки темы

Просмотр