slider v záhlaví - wordpress

Místo pro dotazy a rady ohledně programovacích jazyků (C++, C#, PHP, ASP, Javascript, VBS..) a tvorby webových stránek

Moderátor: Mods_senior

x-rated
Level 5
Level 5
Příspěvky: 2124
Registrován: 27 říj 2014 18:19
Bydliště: Praha
Kontaktovat uživatele:

Re: slider v záhlaví - wordpress

Příspěvek od x-rated »

9900K / G.Skill 32GB@4 GHz / MXI Formula / RTX 2080 Ti / Sabrent 4 TB NVMe / X-Fi THD / HD660S / G403 / G815 / UP2715K 5K IPS / HX1000i / Define R6 / EKWB full
Uživatelský avatar
cervcek
Level 5
Level 5
Příspěvky: 2245
Registrován: 19 led 2012 11:18
Bydliště: Vrchlabí

Re: slider v záhlaví - wordpress

Příspěvek od cervcek »

aha, díky toho jsem si nevšiml

--- Doplnění předchozího příspěvku (26 Pro 2014 21:06) ---

umazal jsem ze stylopisu ten branding img, teď už se mi to zobrazuje správně

Kód: Vybrat vše

<div style="height: 250px;">
<img src="http://petersida.moxo.cz/wordpress/wp-content/uploads/2014/12/gympl-název.png" width="375px" float="left">
<span style="float: right;"> <?php echo do_shortcode("[metaslider id=112]"); ?> </span>
</div>
bez toho div style se mi zobrazuje 7px silná bílá čára mezi menu a sliderem s logem
Děkuju za vaše názory a rady. :thumbup:
x-rated
Level 5
Level 5
Příspěvky: 2124
Registrován: 27 říj 2014 18:19
Bydliště: Praha
Kontaktovat uživatele:

Re: slider v záhlaví - wordpress

Příspěvek od x-rated »

hele tady sem ti udělal zjednodušenou funkční verzi - když budeš posouvat tu rozdělovací lištu ze středu doprava, uvidíš, jak se obsah přizpůsobuje menší velikosti okna, funguje to až do 320px, míň nemá smysl
http://jsfiddle.net/k68avc20/
přímo v tom jsfiddle se můžeš šťourat a sledovat, co to udělá, bez jakejchkoliv následků
logo sem trochu oříznul
9900K / G.Skill 32GB@4 GHz / MXI Formula / RTX 2080 Ti / Sabrent 4 TB NVMe / X-Fi THD / HD660S / G403 / G815 / UP2715K 5K IPS / HX1000i / Define R6 / EKWB full
Uživatelský avatar
cervcek
Level 5
Level 5
Příspěvky: 2245
Registrován: 19 led 2012 11:18
Bydliště: Vrchlabí

Re: slider v záhlaví - wordpress

Příspěvek od cervcek »

Díky moc, všechno to funguje do doby, než dokopíruju ten stylopis od 40. rádku dál. Potom se mi rozsype to menu v liště pod záhlavím
Děkuju za vaše názory a rady. :thumbup:
x-rated
Level 5
Level 5
Příspěvky: 2124
Registrován: 27 říj 2014 18:19
Bydliště: Praha
Kontaktovat uživatele:

Re: slider v záhlaví - wordpress

Příspěvek od x-rated »

koukám, že tam máš na #slideshow nějakej inline zápis css, to tam vůbec nemá co dělat
a to vyhledávání je tam vložený taky nějak divně :shock:
a taky tam máš dva headery v sobě, je třeba to trochu upravit a poladit, co sem vyrobil, to měl bejt jedinej header, co tam bude, všechno ostatní mělo přijít do něj
taky tam máš nějakej hgroup, přitom se nikde nezobrazuje, takže je tam zbytečnej => smazat
9900K / G.Skill 32GB@4 GHz / MXI Formula / RTX 2080 Ti / Sabrent 4 TB NVMe / X-Fi THD / HD660S / G403 / G815 / UP2715K 5K IPS / HX1000i / Define R6 / EKWB full
Uživatelský avatar
cervcek
Level 5
Level 5
Příspěvky: 2245
Registrován: 19 led 2012 11:18
Bydliště: Vrchlabí

Re: slider v záhlaví - wordpress

Příspěvek od cervcek »

jo, ten header je tam dvakrát, ale když smažu to, co tam bylo, tak se mi ztratí vyhledávání a menu, takže vložit jenom ten div?
Děkuju za vaše názory a rady. :thumbup:
x-rated
Level 5
Level 5
Příspěvky: 2124
Registrován: 27 říj 2014 18:19
Bydliště: Praha
Kontaktovat uživatele:

Re: slider v záhlaví - wordpress

Příspěvek od x-rated »

v headeru zůstane jenom menu, kde v tý liště by mělo bejt i vyhledávání (teď je nějak mimo) a nad tim bude to, co je už hotový na jsfiddle
9900K / G.Skill 32GB@4 GHz / MXI Formula / RTX 2080 Ti / Sabrent 4 TB NVMe / X-Fi THD / HD660S / G403 / G815 / UP2715K 5K IPS / HX1000i / Define R6 / EKWB full
Uživatelský avatar
cervcek
Level 5
Level 5
Příspěvky: 2245
Registrován: 19 led 2012 11:18
Bydliště: Vrchlabí

Re: slider v záhlaví - wordpress

Příspěvek od cervcek »

Když jsem z headeru ještě něco vymazal, tak se mi buď ztratilo menu, nebo hledání.
v header.php mám teď

Kód: Vybrat vše

<body <?php body_class(); ?>>
<div id="page" class="hfeed">
	<header id="branding" role="banner">

<div id="top">
<a href="/"><img src="http://screenshot.cz/ICACP/gympl_logo.png" alt="logo"></a>
<div id="slideshow"><?php echo do_shortcode("[metaslider id=112]"); ?></div>
</div>

			

			<?php
				// Check to see if the header image has been removed
				$header_image = get_header_image();
				if ( $header_image ) :
					// Compatibility with versions of WordPress prior to 3.4.
					if ( function_exists( 'get_custom_header' ) ) {
						/*
						 * We need to figure out what the minimum width should be for our featured image.
						 * This result would be the suggested width if the theme were to implement flexible widths.
						 */
						$header_image_width = get_theme_support( 'custom-header', 'width' );
					} else {
						$header_image_width = HEADER_IMAGE_WIDTH;
					}
					?>
	
				<div class="only-search<?php if ( $header_image ) : ?> with-image<?php endif; ?>">
				<?php get_search_form(); ?>
				</div>
			<?php
				else :
			?>
				<?php get_search_form(); ?>
			<?php endif; ?>

			<nav id="access" role="navigation">
				<h3 class="assistive-text"><?php _e( 'Main menu', 'twentyeleven' ); ?></h3>
				<?php /* Allow screen readers / text browsers to skip the navigation menu and get right to the good stuff. */ ?>
				<div class="skip-link"><a class="assistive-text" href="#content"><?php _e( 'Skip to primary content', 'twentyeleven' ); ?></a></div>
				<?php if ( ! is_singular() ) : ?>
					<div class="skip-link"><a class="assistive-text" href="#secondary"><?php _e( 'Skip to secondary content', 'twentyeleven' ); ?></a></div>
				<?php endif; ?>
				<?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assigned to the primary location is the one used. If one isn't assigned, the menu with the lowest ID is used. */ ?>
				<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
			</nav><!-- #access -->
	</header><!-- #branding -->


	<div id="main">
a header v style.css mám

Kód: Vybrat vše

/* =Header
----------------------------------------------- */

#branding {
	border-top: 2px solid #bbb;
	padding-bottom: 10px;
	position: relative;
	z-index: 9999;
}
#site-title {
	margin-right: 270px;
	padding: 3.65625em 0 0;
}
#site-title a {
	color: #111;
	font-size: 30px;
	font-weight: bold;
	line-height: 36px;
	text-decoration: none;
}
#site-title a:hover,
#site-title a:focus,
#site-title a:active {
	color: #1982d1;
}
#site-description {
	color: #7a7a7a;
	font-size: 14px;
	margin: 0 270px 3.65625em 0;
}
#branding img {
	height: auto;
	display: block;
	width: 100%;
}

body {
width: 1000px;
margin: 2em auto;
padding: 0;
background: #e2e2e2;
}

img {
vertical-align: middle;
}

#top:before,
#top:after {
content: "";
display: table;
clear: both;
}

#top {
background: rgb(26,188,156);
}

#top>a {
width: 343px;
display: block;
float: left;
margin: 10px 0 0 10px;
}

#slideshow {
width: 625px;
float: right;
}

#top>a>img,
#slideshow>img {
max-width: 100%;
}
když vložím ten zbytek stylů z jsfiddle do style.css , tak se mi rozsype menu
Děkuju za vaše názory a rady. :thumbup:
x-rated
Level 5
Level 5
Příspěvky: 2124
Registrován: 27 říj 2014 18:19
Bydliště: Praha
Kontaktovat uživatele:

Re: slider v záhlaví - wordpress

Příspěvek od x-rated »

mně to teď přijde celkem ok, ale ten celej searchbox hoď před koncovej </nav>, je tam pořád úplně mimo nějak divně vlepenej
a pak tam máš v nav zase nějaký h3, který vůbec neni vidět, takže smazat
9900K / G.Skill 32GB@4 GHz / MXI Formula / RTX 2080 Ti / Sabrent 4 TB NVMe / X-Fi THD / HD660S / G403 / G815 / UP2715K 5K IPS / HX1000i / Define R6 / EKWB full
Uživatelský avatar
cervcek
Level 5
Level 5
Příspěvky: 2245
Registrován: 19 led 2012 11:18
Bydliště: Vrchlabí

Re: slider v záhlaví - wordpress

Příspěvek od cervcek »

jo, dobře a co s tím style? co mám upravit, abych to tam mohl vložit celý? zkoušel jsem to zobrazit na mobilu tak, jak to je teď: chrome OK, opera mini to zobrazuje hrozně a defalutní prohlížeč v androidutaky nic moc
Děkuju za vaše názory a rady. :thumbup:
x-rated
Level 5
Level 5
Příspěvky: 2124
Registrován: 27 říj 2014 18:19
Bydliště: Praha
Kontaktovat uživatele:

Re: slider v záhlaví - wordpress

Příspěvek od x-rated »

1) na řádku 550 úplně zruš celý body, to sem tam měl jenom proto, aby to vypadalo v jsfiddle stejně jako na webu
2) na samej konec css přidej tohle

Kód: Vybrat vše

@media screen and (max-width: 1100px) {
#top>a,
#slideshow {
float: none;
margin: auto;
}

#top>a {
margin: 20px auto;
}
}

@media screen and (max-width: 705px) {
#slideshow {
width: auto;
}

@media screen and (max-width: 500px) {
#top>a {
width: 200px;
}
}
9900K / G.Skill 32GB@4 GHz / MXI Formula / RTX 2080 Ti / Sabrent 4 TB NVMe / X-Fi THD / HD660S / G403 / G815 / UP2715K 5K IPS / HX1000i / Define R6 / EKWB full
Uživatelský avatar
cervcek
Level 5
Level 5
Příspěvky: 2245
Registrován: 19 led 2012 11:18
Bydliště: Vrchlabí

Re: slider v záhlaví - wordpress

Příspěvek od cervcek »

super! už se to zmenšuje, ale to hledání mi pořád přeskakuje nahoru, když zmenším stránku
Děkuju za vaše názory a rady. :thumbup:
Zamčeno

Zpět na „Programování a tvorba webu“