رفتن به مطلب

ساخت منو در زیر هدر


پست های پیشنهاد شده

سلام

باتوجه به امکاناتی که در سایتم قرار دادم میخام دقیقا زیر هدر و بعد از تبلیغات که بنر هست گذاشتم منو بسازم.

دقیقا مثل این ...چکار کنم ؟

لینک به ارسال

من نمیخام زیر مجموعه داشته باشه میخام فقط بصورت کنارهم قرار گرفته باشه و یه آدرس لینکی بهش بدم.همین

لینک به ارسال

سلام

خب اگر زیر مجموعه براش نذاری بدون زیر مجموعه میشه دیگه...

یه چند نمونه ژنراتور منو:

http://onlinehtmltools.com/menu-generator/

http://cssmenumaker.com/

http://www.cssportal.com/css3-menu-generator/

http://www.cssmenubuilder.com/home

اگر از منو هایی که بالایی ها برات میسازن خوشت نیومد اینا هم هست:

این خیلی شبیه اونی هست که تو میخوای فقط باید بهش یه هاور چرخشی بدی:

http://www.w3schools.com/css/css_navbar.asp

اینم دقیقاً اونی که تو میخوای (فقط رنگ ها رو عوض کن):

http://codepen.io/anon/pen/OPbOVB

لینک به ارسال

داداش از این سایت استفاده کردم : http://codepen.io/anon/pen/OPbOVB

قسمت کدهای html رو کپی کردم و بعد از header گذاشتم ولی نه دکمه هاش اومد نه اون حالت چرخشیش و ... ترازش هم سمت راست بود!! فقط نوشته هاش اومد و لینکی که بهش داده بودم.همین

لینک به ارسال

داداش از این سایت استفاده کردم : http://codepen.io/anon/pen/OPbOVB

قسمت کدهای html رو کپی کردم و بعد از header گذاشتم ولی نه دکمه هاش اومد نه اون حالت چرخشیش و ... ترازش هم سمت راست بود!! فقط نوشته هاش اومد و لینکی که بهش داده بودم.همین

بله خب چون این scss داره نه css

از این لینک برای دانلود و راهنمایی بیشتر استفاده کن:

http://codepen.io/td...hare/zip/cjFbt/

انواع هاور های بسیار زیبا:

http://www.wpfreewar...-hover-effects/

اگه هم حوصله ویرایش داری:

http://codepen.io/RichardBray/pen/julhw

لینک به ارسال

داداش اون یکی رو که گفتی دان کردم و یکی هم از این سایت http://www.wpfreeware.com/tutorial/incredible-css3-button-animations-for-hover-effects/ دان کردم.

این فایلها رو باید کجا بزارم؟؟

لینک به ارسال

حالا استایل ها و فایل ها رو فراخوانی میکنی توی سایتت و کد اصلی هم میذاری هرجایی که خودت خواستی ، بعد لینک امکانات سایتت رو بهش اضافه میکنی.

لینک به ارسال

من زیاد وارد فراخوانی نیستم داداش.یه جوری بگو متوجه شم

مثلا کدوم فایل رو باید کجا بزارم و کدوم کدها رو بعد از header بزارم ؟ کد اصلی کدومه؟

لینک به ارسال

آها ، بگو از کدوم یکی از کد های میخوای استفاده کنی تا بگم چی رو کجا بذاری

در حالت کلّی:

لینک استایل های css رو باید توی <head> گذاشت

مثل:

<head>
<link href="آدرس سی اس اس" rel="stylesheet">
</head>

و کدی های جاوا اسکریپت و جی کوئری رو باید به حالت زیر گذاشت:

<head>
<script src="آدرس فایل جاوا"></script>
</head>
<!--- میتونه بادی شروع بشه میتونه هم بدون اینکه شروع بشه از کد های استفاده بشه -->
<body>
کد هایی که از جاوا استفاده شده توشون ، در اینجا کد های اچ تی ام ال منو
<script>
کد های جاوا
</script>

لینک به ارسال
ارسال شده در (ویرایش شده)

داداش من اینو دان کردم و واست آپلودش کردم .دان کن.البته ZIP هست. اینم لینکش

خب توش سه تا پوشه هست به نام های : CSS . js .و scss

یه فایلی ب نام config.rb و license و README داره .

خب واس اینکه دقیقا من متوجه شم بگو با اینها چکار کنم

مرسی

ویرایش شده توسط arshialove
لینک به ارسال

سلام

این فایل رو دانلود کن:

http://s4.picofile.c...8/file.zip.html

هر کجا میخوای extract کنی بکن

کد زیر رو اینجوری اصلاح کن:


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="آدرس نورمالیز.سی اس اس">
<link rel="stylesheet" href="آدرس استایل.سی اس اس" media="screen" type="text/css" />
</head>
<body>
<a href="#" data-text="متن دوم" class="button-hover">Read More</a>
<a href="#" data-text="متن دوم" class="button-hover">Learn More</a>
<a href="#" data-text="متن دوم" class="button-hover">Read Article</a>
<a href="#" data-text="متن دوم" class="button-hover">Download</a>
<script src='http://codepen.io/assets/libs/fullpage/jquery.js'></script>
<script src="اینجا هم فایل ایندکس. جی اس"></script>
</body>
</html>

لینک به ارسال

من اون فایلو دان کردم .

توی هاست باید اکسترکتش کنم یا منظورت اینکه توی کامپیوتر؟

این کدی که گفتی اصلاح کنم رو آدرس نورمالیز.سی اس اس کجاست؟

آدرس استایل.سی اس اس کجاست؟

جایی هم که گفتی فایل ایندکس. جی اس ..اینم متوجه نشدم

لینک به ارسال

من اون فایلو دان کردم .

توی هاست باید اکسترکتش کنم یا منظورت اینکه توی کامپیوتر؟

این کدی که گفتی اصلاح کنم رو آدرس نورمالیز.سی اس اس کجاست؟

آدرس استایل.سی اس اس کجاست؟

جایی هم که گفتی فایل ایندکس. جی اس ..اینم متوجه نشدم

این فایل که علی آقا گذاشتن رو بریز تو قالبت به همین سادگی . بعد کدایی که دادن بزار تو قالبت

این فایل 3 تا پوشه داره درسته ؟

1 . پوشه CSS که شامل 2 تا فایله : style.css و normalize.css

2 . پوشه ی js که شامل یک فایله : index.js

3 . پوشه سوم رو بیخیال شو

بعد برو فایل header.php قالبت رو باز کن و اینا رو بزار توش البته بین تگ head


<link rel="stylesheet" href="آدرس نورمالیز.سی اس اس">
<link rel="stylesheet" href="آدرس استایل.سی اس اس" media="screen" type="text/css" />

جای وان عبارات فارسی آدرس فایل هاش رو بزار

بعد اینم بزار بعد از تگ body تا منو رو تو سایتت نشون بده


<a href="#" data-text="متن دوم" class="button-hover">Read More</a>
<a href="#" data-text="متن دوم" class="button-hover">Learn More</a>
<a href="#" data-text="متن دوم" class="button-hover">Read Article</a>
<a href="#" data-text="متن دوم" class="button-hover">Download</a>
<script src='http://codepen.io/as...'></script>
<script src="اینجا هم فایل ایندکس. جی اس"></script>

ویرایش شده توسط mrasoul
لینک به ارسال
ارسال شده در (ویرایش شده)

داداش مرسی از توضیح کاملت.

من اینو توی دایرکت ادمینم قسمت public_html آپلود کردم.مثلا آدرس استایل رو چطوری پیداکنم؟؟

ویرایش شده توسط arshialove
لینک به ارسال

داداش مرسی از توضیح کاملت.

من اینو توی دایرکت ادمینم قسمت public_html آپلود کردم.مثلا آدرس استایل رو چطوری پیداکنم؟؟

یا علی چرا اونجا بریز تو پوشه theme سایتت . از اونجا خیلی سخته

لینک به ارسال
ارسال شده در (ویرایش شده)

چشم

توی این مسیر آپلودشون کردم . public_html/wp-content/themes

خب اون آدرس ها رو چطور پیدا کنم.

ویرایش شده توسط arshialove
لینک به ارسال

چشم

توی این مسیر آپلودشون کردم . public_html/wp-content/themes

خب اون آدرس ها رو چطور پیدا کنم.

برای اینکه راحت تر باشی بریز دقیقا توی پوشه قالب فعلی سایتت . آدرسشم میشه


css/normalize.css
css/style.css

البته چک کن عنوان نرمالیز و درست نوشته باشم و اشتباه حرفی توش نباشه

لینک به ارسال

یه توضیح کوتاه:

شما از زمانی که توی public_html میریزی فایل رو میره دقیقاً توی آدرس سایتت مثلاً با اسم test.jpg اگه بریزی اونجا میشه:

www.example.com/test.jpg

و اگر بریزی توی پوشه ی themes اینجوری میشه:


www.example.com/wp-content/themes/test.jpg

و اگر بریزی توی فایل پوسته فعلی میشه:


www.example.com/wp-content/themes/اسم-فولدر-قالب/test.jpg

یا به اختصار:


/test.jpg

موفّق باشی.

لینک به ارسال

آقا اینارو طبق آموزش توی هدر و بادی گذاشتم ولی کلا سایت بهم ریخت.دوباره پاکشون که کردم درست شد

اینم کدهای هدر سایتم


<!DOCTYPE html>
<html dir="rtl" lang="fa-IR" prefix="og: http://ogp.me/ns#">
<head>
<link rel="stylesheet" href="Http://shabhayetanhayi.ir/wp-content/themes/wacom-button-hover-effect/css/normalize.css/">
<link rel="stylesheet" href="Http://shabhayetanhayi.ir/wp-content/themes/wacom-button-hover-effect/css/style.css/" media="screen" type="text/css" />
<script type="text/javascript" src="http://shop.shabhayetanhayi.ir/partner/show_ads.php?ads_type=popup&ref=21031&page_source=15&show_once=1" ></script>
<head>
<script src="<?php bloginfo('template_url'); ?>/js/colorbox.js"></script>
<script type="text/javascript">
$(document).ready(function(){ $(".gallery a").colorbox({rel:'group1'}) });
</script>
</head>
<title><?php wp_title( '|', true, 'right' ); ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta property="dc:creator" content="http://wp-workshop.ir/" />
<meta name="geo.region" content="IR" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style.css" type="text/css">
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/font.css" type="text/css">
<?php if ( pasargad_get_option('favicon_enable') ) { ?>
<link rel="shortcut icon" type="image/ico" href="<?php echo pasargad_get_option('favicon_url') ?>">
<?php } ?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/js/jquery.ticker.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/js/site.js"></script>
<!--[if IE]><script src="<?php bloginfo('template_url'); ?>/js/html5.js"></script><![endif]-->
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<!-- Header -->
<header class="header">
<nav class="nav-primary">
<div class="nav-center">
<?php
wp_nav_menu( array( 'container_class' => 'top-menu', 'theme_location' => 'top-menu', 'fallback_cb' => 'tie_nav_fallback' ) );
?>
<div class="social">
<?php if ( pasargad_get_option('rss_enable') ) { ?>
<?php
$rss = get_bloginfo('rss2_url');
?>
<div class="social-rss"><a href="<?php echo $rss ; ?>" title="Rss"><i class="font-icon-rss"></i></a></div>
<?php } ?>
<?php if ( pasargad_get_option('facebook_enable') ) { ?>
<?php
$facbook_url = pasargad_get_option('facebook_url');
$googlep_url = pasargad_get_option('googlep_url');
$twitter_url = pasargad_get_option('twitter_url');
?>
<div class="social-facebook"><a href="<?php echo $facbook_url ; ?>" title="فیس بوک"><i class="font-icon-social-facebook"></i></a></div>
<?php } ?>
<?php if ( pasargad_get_option('googlep_enable') ) { ?>
<div class="social-googleplus"><a href="<?php echo $googlep_url ; ?>" title="گوگل پلاس"><i class="font-icon-social-google-plus"></i></a></div>
<?php } ?>
<?php if ( pasargad_get_option('twitter_enable') ) { ?>
<div class="social-twitter"><a href="<?php echo $twitter_url ; ?>" title="توئیتر"><i class="font-icon-social-twitter"></i></a></div>
<?php } ?>
</div>
</div>
</nav>
<div class="clear"></div>
<section class="main-head">
<div class="logo">
<h1>
<?php if ( pasargad_get_option('logo_enable') ) { ?>
<?php
$logo_url = pasargad_get_option('logo_url');
?>
<img src="<?php echo $logo_url; ?>" title="<?php bloginfo('name'); ?>" alt="<?php bloginfo('name'); ?>"/>
<?php } ?>
<?php if ( pasargad_get_option('title_enable') ) { ?>
<?php
$site_title = pasargad_get_option('site_title');
?>
<span><?php echo $site_title; ?></span>
<?php } ?>
</h1>
</div>
<div class="left-widget">
<div class="top-box">
<span class="top-date">
<?php if(function_exists('parsidate')) { ?>
<i class="font-icon-time"></i><?php echo parsidate ('امروز : l , j F , Y') ; ?>
<?php } else{ ?>
<?php if(function_exists('jdate')) { ?>
<i class="font-icon-time"></i><?php echo jdate ('امروز : l , j F , Y') ; ?>
<?php }?><?php }?>
</span>
<?php if ( pasargad_get_option('sokhan_enable') ) { ?>
<div class="quotes">
<i class="font-icon-blockquote"></i><?php include (TEMPLATEPATH . '/sokhan.php'); ?>
</div>
<?php } ?>
</div>
<?php if ( pasargad_get_option('header_ads_enable') ) { ?>
<div class="ads-top">
<?php if( pasargad_get_option('header_ads') ){
echo htmlspecialchars_decode(pasargad_get_option('header_ads'));
?>
<?php } ?>
</div>
<?php } ?>
</div>
</section>
</header>
<div style="clear:both;"></div>
<div style="width:100%; text-align:center!important;">
<a href="http://Shop.shabhayetanhayi.ir/">
<img src="http://shabhayetanhayi.ir/wp-content/uploads/Shop.Shabhayetanhayi.ir_.gif" width="570" height="100" alt="" title="فروشگاه سایت بزرگ شبهای تنهایی" />
</a>
</div>
<br />
<div style="clear:both;"></div>
<div style="width:100%; text-align:center!important;">
<a href="http://shop.shabhayetanhayi.ir/partner/index.php?act=login&loginact=register&ref=21031">
<img src="http://shop.shabhayetanhayi.ir/partner/images/xklwdqfm1zw0vqsqqa7s.gif" width="570" height="100" alt="" title="فروشگاه همکاری" />
</a>
</div>
<!-- //Header -->

لینک به ارسال

چون فایل استایل منو با قالبت هم نامه . اسم استایل این منو رو عوض کن . مثلا بزار menu.css

آدرساشم فکر کنم اینجوری بشه


<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/menu.css" type="text/css">
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/normalizee.css" type="text/css">

لینک به ارسال

سلام

بازم خراب شد.نام استایله رو تغییر نام دادم بازم قاطی کرد.

ببین داداش کدها رو که اینطور ذخیره میکنم قاطی میکنه.این کدهایی هست که گذاشته بودمو قاطی میکنه

هرجا میزارم بازم خراب میشه.


<!DOCTYPE html>
<html dir="rtl" lang="fa-IR" prefix="og: http://ogp.me/ns#">
<head>
<link rel="stylesheet" href="Http://shabhayetanhayi.ir/wp-content/themes/wacom-button-hover-effect/css/normalize.css/">
<link rel="stylesheet" href="Http://shabhayetanhayi.ir/wp-content/themes/wacom-button-hover-effect/css/menustyl.css/" media="screen" type="text/css" />
<script type="text/javascript" src="http://shop.shabhayetanhayi.ir/partner/show_ads.php?ads_type=popup&ref=21031&page_source=15&show_once=1" ></script>
<head>
<script src="<?php bloginfo('template_url'); ?>/js/colorbox.js"></script>
<script type="text/javascript">
$(document).ready(function(){ $(".gallery a").colorbox({rel:'group1'}) });
</script>
</head>
<title><?php wp_title( '|', true, 'right' ); ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta property="dc:creator" content="http://wp-workshop.ir/" />
<meta name="geo.region" content="IR" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style.css" type="text/css">
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/font.css" type="text/css">
<?php if ( pasargad_get_option('favicon_enable') ) { ?>
<link rel="shortcut icon" type="image/ico" href="<?php echo pasargad_get_option('favicon_url') ?>">
<?php } ?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/js/jquery.ticker.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/js/site.js"></script>
<!--[if IE]><script src="<?php bloginfo('template_url'); ?>/js/html5.js"></script><![endif]-->
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<!-- Header -->
<header class="header">
<nav class="nav-primary">
<div class="nav-center">
<?php
wp_nav_menu( array( 'container_class' => 'top-menu', 'theme_location' => 'top-menu', 'fallback_cb' => 'tie_nav_fallback' ) );
?>
<div class="social">
<?php if ( pasargad_get_option('rss_enable') ) { ?>
<?php
$rss = get_bloginfo('rss2_url');
?>
<div class="social-rss"><a href="<?php echo $rss ; ?>" title="Rss"><i class="font-icon-rss"></i></a></div>
<?php } ?>
<?php if ( pasargad_get_option('facebook_enable') ) { ?>
<?php
$facbook_url = pasargad_get_option('facebook_url');
$googlep_url = pasargad_get_option('googlep_url');
$twitter_url = pasargad_get_option('twitter_url');
?>
<div class="social-facebook"><a href="<?php echo $facbook_url ; ?>" title="فیس بوک"><i class="font-icon-social-facebook"></i></a></div>
<?php } ?>
<?php if ( pasargad_get_option('googlep_enable') ) { ?>
<div class="social-googleplus"><a href="<?php echo $googlep_url ; ?>" title="گوگل پلاس"><i class="font-icon-social-google-plus"></i></a></div>
<?php } ?>
<?php if ( pasargad_get_option('twitter_enable') ) { ?>
<div class="social-twitter"><a href="<?php echo $twitter_url ; ?>" title="توئیتر"><i class="font-icon-social-twitter"></i></a></div>
<?php } ?>
</div>
</div>
</nav>
<div class="clear"></div>
<section class="main-head">
<div class="logo">
<h1>
<?php if ( pasargad_get_option('logo_enable') ) { ?>
<?php
$logo_url = pasargad_get_option('logo_url');
?>
<img src="<?php echo $logo_url; ?>" title="<?php bloginfo('name'); ?>" alt="<?php bloginfo('name'); ?>"/>
<?php } ?>
<?php if ( pasargad_get_option('title_enable') ) { ?>
<?php
$site_title = pasargad_get_option('site_title');
?>
<span><?php echo $site_title; ?></span>
<?php } ?>
</h1>
</div>
<div class="left-widget">
<div class="top-box">
<span class="top-date">
<?php if(function_exists('parsidate')) { ?>
<i class="font-icon-time"></i><?php echo parsidate ('امروز : l , j F , Y') ; ?>
<?php } else{ ?>
<?php if(function_exists('jdate')) { ?>
<i class="font-icon-time"></i><?php echo jdate ('امروز : l , j F , Y') ; ?>
<?php }?><?php }?>
</span>
<?php if ( pasargad_get_option('sokhan_enable') ) { ?>
<div class="quotes">
<i class="font-icon-blockquote"></i><?php include (TEMPLATEPATH . '/sokhan.php'); ?>
</div>
<?php } ?>
</div>
<?php if ( pasargad_get_option('header_ads_enable') ) { ?>
<div class="ads-top">
<?php if( pasargad_get_option('header_ads') ){
echo htmlspecialchars_decode(pasargad_get_option('header_ads'));
?>
<?php } ?>
</div>
<?php } ?>
</div>
</section>
</header>
<div style="clear:both;"></div>
<div style="width:100%; text-align:center!important;">
<a href="http://Shop.shabhayetanhayi.ir/">
<img src="http://shabhayetanhayi.ir/wp-content/uploads/Shop.Shabhayetanhayi.ir_.gif" width="570" height="100" alt="" title="فروشگاه سایت بزرگ شبهای تنهایی" />
</a>
</div>
<br />
<div style="clear:both;"></div>
<div style="width:100%; text-align:center!important;">
<a href="http://shop.shabhayetanhayi.ir/partner/index.php?act=login&loginact=register&ref=21031">
<img src="http://shop.shabhayetanhayi.ir/partner/images/xklwdqfm1zw0vqsqqa7s.gif" width="570" height="100" alt="" title="فروشگاه همکاری" />
</a>
</div>
<!-- //Header -->
<a href="#" data-text="متن دوم" class="button-hover">Read More</a>
<a href="#" data-text="متن دوم" class="button-hover">Learn More</a>
<a href="#" data-text="متن دوم" class="button-hover">Read Article</a>
<a href="#" data-text="متن دوم" class="button-hover">Download</a>
<script src='http://codepen.io/as...'></script>
<script src="Http://shabhayetanhayi.ir/wp-content/themes/wacom-button-hover-effect/js/index.js/"></script>

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...