• اطلاعیه ها

    • Morteza

      باهم بسازیم: اطلس ووکامرس و وردپرس   14/07/96

      تاپیک ایجاد شده برای بحث در جهت ایجاد یک منبع، ویکی، صفحات توضیحی و یا بخش آموزشی جامع برای وردپرس و متعلقات مختلف آن است. لطفا جهت مشارکت در این بحث، ارائه پیشنهاد و یا انتقاد به تاپیک فوق مراجعه کنید. باهم بسازیم: اطلس ووکامرس و وردپرس
M.A.H.D.Y

نحوه استفاده از کد جاوا در پست

6 پست در این موضوع قرار دارد

با سلام.

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

میخواستم ببینم چطور می تونیم کد زیر رو توی پست فراخوانی کنم..این کد یک باکس با چند تب هستش که با استفاده ار دستورات jQuery نوشته شده..می خواستم بدونم آیا میشه این کد رو در پست یا برگه (وردپرس ) فراخوانی کرد...

چطور باید این کار رو انجام داد...با تشکر


<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function() {
$(".tab").slideUp();
$(".tab:first").slideDown();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab").slideUp();
var activeTab = $(this).attr("rel");
$("#"+activeTab).slideToggle();
});
});
</script>
<style>
ul.tabs {
margin: 0;
padding: 0;
float: right;
list-style: none;
height: 32px;
width: 100%;
font:12px tahoma;
}
ul.tabs li {
float: right;
margin: 0;
cursor: pointer;
padding: 0px 21px ;
height: 31px;
line-height: 31px;
border: 1px solid #999;
border-right:none;
font-weight: bold;
background: #EEE;
overflow: hidden;
position: relative;
}
ul.tabs li:hover {
background: #CCCCCC;
}
ul.tabs li:first-child{
border-radius:0 5px 0 0;
-moz-border-radius:0 5px 0 0;
-ms-border-radius:0 5px 0 0;
-webkit-border-radius:0 5px 0 0;
-o-border-radius:0 5px 0 0;
-khtml-border-radius:0 5px 0 0;
border-right:1px solid #999;
}
ul.tabs li:last-child{
border-radius:5px 0 0 0;
-moz-border-radius:5px 0 0 0;
-ms-border-radius:5px 0 0 0;
-webkit-border-radius:5px 0 0 0;
-o-border-radius:5px 0 0 0;
-khtml-border-radius:5px 0 0 0;
}
ul.tabs li.active{
background: #FFF;
border-bottom: 1px solid #FFF;
}
.alltabs {
border: 1px solid #999;
clear: both;
float: right;
width: 100%;
background: #FFF;
border-radius:5px 0 5px 5px;
-moz-border-radius:5px 0 5px 5px;
-ms-border-radius:5px 0 5px 5px;
-webkit-border-radius:5px 0 5px 5px;
-o-border-radius:5px 0 5px 5px;
-khtml-border-radius:5px 0 5px 5px;
}
.tab {
padding: 10px;
font:11px tahoma;
text-align:right;
display: none;
}
</style>

و


<div style="display:none"></div>
<div id="container">
<ul class="tabs">
<li class="active" rel="test11">تب اول</li>
<li rel="test12">تب دوم</li>
<li rel="test13">تب سوم</li>
</ul>
<div class="alltabs">
<div id="test11" class="tab">
متن تب اول
</div>
<div id="test12" class="tab">
متن تب دوم
</div>
<div id="test13" class="tab">
متن تب سوم
</div>
</div>
</div>

با تشکر

0

به اشتراک گذاری این پست


لینک به پست

بهترین کار ساخت تمپلیت جداگانه در قالب و نسبت دادنش به برگه مورد نظره ولی در حالت کلی این کدها به همین صورت هم اگر وارد ویرایشگر متنی بشوند در مطلب عمل می کنند

نکته: این کدها جاوا اسکریپت هستند که با کدهای جاوا فرق دارند کدهای جاوا شرایطی دیگه برای اجرا دارند

البته این بخش از کدتون رو به فایل style.css قالب اضافه کنید


ul.tabs {
margin: 0;
padding: 0;
float: right;
list-style: none;
height: 32px;
width: 100%;
font:12px tahoma;
}
ul.tabs li {
float: right;
margin: 0;
cursor: pointer;
padding: 0px 21px ;
height: 31px;
line-height: 31px;
border: 1px solid #999;
border-right:none;
font-weight: bold;
background: #EEE;
overflow: hidden;
position: relative;
}
ul.tabs li:hover {
background: #CCCCCC;
}
ul.tabs li:first-child{
border-radius:0 5px 0 0;
-moz-border-radius:0 5px 0 0;
-ms-border-radius:0 5px 0 0;
-webkit-border-radius:0 5px 0 0;
-o-border-radius:0 5px 0 0;
-khtml-border-radius:0 5px 0 0;
border-right:1px solid #999;
}
ul.tabs li:last-child{
border-radius:5px 0 0 0;
-moz-border-radius:5px 0 0 0;
-ms-border-radius:5px 0 0 0;
-webkit-border-radius:5px 0 0 0;
-o-border-radius:5px 0 0 0;
-khtml-border-radius:5px 0 0 0;
}
ul.tabs li.active{
background: #FFF;
border-bottom: 1px solid #FFF;
}
.alltabs {
border: 1px solid #999;
clear: both;
float: right;
width: 100%;
background: #FFF;
border-radius:5px 0 5px 5px;
-moz-border-radius:5px 0 5px 5px;
-ms-border-radius:5px 0 5px 5px;
-webkit-border-radius:5px 0 5px 5px;
-o-border-radius:5px 0 5px 5px;
-khtml-border-radius:5px 0 5px 5px;
}
.tab {
padding: 10px;
font:11px tahoma;
text-align:right;
display: none;
}

و مابقی را در پست قرار دهید

2

به اشتراک گذاری این پست


لینک به پست

با تشکر..آیا کدهایی که می خوام در پست قرار بدم آیا باید در بین تگ هایی خاصی قرار داد منظورم نگ های <head> و < body> هستش..

و کدهای stylee که گفتید آیا مکان خاصی باید قرار بگیره در style.css

ویرایش شده در توسط M.A.H.D.Y
0

به اشتراک گذاری این پست


لینک به پست

کدهای sttyle پله کانی هستند بهتره در انتهای فایل باشند

بهتر است کدهای js را بعد از کدهای html قرار بدید ولی کد اتصال به کتابخانه را در مرحله اول نگذارید خود وردپرس به کتابخانه متصله اگر فایل اجرا نشد کد را قبلی از همه کدهایتان بگذارید

3

به اشتراک گذاری این پست


لینک به پست

کد استایل رو که گفتید در انتهای کد ها قالب قرار دادم...

اما در مورد اون 2 تا کدی که گفتید و js خوب متوجه منظور شما نشدم که چطور باید کد ها رو قرار بدم توی پست ...آیا امکانش هست طربقه قرار گیری اون 2 کد رو بگید


<html>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<head>
<script>
$(document).ready(function() {
$(".tab").slideUp();
$(".tab:first").slideDown();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab").slideUp();
var activeTab = $(this).attr("rel");
$("#"+activeTab).slideToggle();
});
});
</script>
</head>
<body>
<!-- this tool by http://moisrex.rozblog.com --->
<div style="display:none"><h2><a href="http://moisrex.rozblog.com">کدستان</a></h2></div><div id="container">
<ul class="tabs">
<li class="active" rel="test11">تب اول</li>
<li rel="test12">تب دوم</li>
<li rel="test13">تب سوم</li>
</ul>
<div class="alltabs">
<div id="test11" class="tab">
متن تب اول
</div>
<div id="test12" class="tab">
متن تب دوم
</div>
<div id="test13" class="tab">
متن تب سوم
</div>
</div>
</div>
<a style="display:none" href="http://moisrex.rozblog.com/">ابزار ساخت کد منو های دارای تب</a>
</body>
</html>

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

جدول بدون شکل هستش و فقط نوشته ها توی پست نشان داده میشه .. میشه بگید 2 کد رو چطور باید قرار بدم در پست

ویرایش شده در توسط M.A.H.D.Y
0

به اشتراک گذاری این پست


لینک به پست

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

کد styll رو در همون فایل style.css در آخرش کپی کردم

کد اولی رو در قسمت Header سایت بعد از تگ head کپی کردم

در خود پست هم کد دوم رو به اضافه فایل js در بین تگ body قرار دادم ..اینطوری فقط تونیستم این باکس رو بیارم و اجرا کنم...

ممنون از راهنمایی اگر باز مطلبی اضافه ای هست یا روش بهتری راهنمایی کنید ..

---

اگر به باکس تب دار بهتری با امکانات بهتری مد نظرتون هست معرفی کنید هم ممنون میشم...

ویرایش شده در توسط M.A.H.D.Y
1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط mrasoul
      با عرض سلام و خسته نباشید ... لطفا این صفحه را ببینید :
      صفحه مورد نظر
      در این صفحه و بعد از ویدئو یک فهرست وجود دارد با آیتمهایی مثلا
      1.Introduction
      2.Brackets Extensions
      و ... که در اصل سرفصل های این آموزش است که شامل یکسری زیر مجموعه هستند ... وقتی روی زیرمجموعه ها کلیک می کنید اون مجموعه را نشان می دهید . به عنوان مثال روی
      1.2The Extension Manager
      کلیک کنید ...
      من اگر بخوام یک پست آموزشی کامل بسازم و تو این پست این سرفصل ها رو تعریف کنم آیا وردپرس امکانی رو داره بدون اینکه برای هر فصل یک پست ساخت همه ی پستها را داخل یک پست نوشت ؟ یعنی یک پست چند صفحه ایی مثلا مقدمه در خود پست و در مقدمه سرفصل ها رو تعریف کنیم حالا همون پست چند صفحه را زیرمجموعه داشته باشد که این صفحه ها همون سرفصل ها باشند .
      چون اگر قرار باشد برای هر فصل یک پست بفرستم طبیعتا کار بسیار مشکل و زمان بری است چرا که در هرکدام از این پستها باید با زمینه دلخواه سرفصل ها را تعریف کنم و هربار که پست جدید بفرستم در داخل بقیه سرفصل های قبل باید بروم و در زمینه دلخوه لینک این سرفصل جدید را تعریف کنم
       
    • توسط lloyd
      سلام دوستان خوبم اگر کسی میتواند پوسته The Voux را در هاست من نصب کند لطفا به من اینجا اطلاع بدهد. خطای نصب: شیوه نامه گم شده است !
       
    • توسط shayan201680
      با سلام
      بنده یک سایت اصلی وردپرسی دارم و قرار شده که در ساب دامینشم از وردپرس استفاده کنم.
      الان میخوام کاری کنم که کاربران اگر در سایت اصلی ثبت نام کردند بتونند با همون مشخصات در ساب دامین نیز لاگین کنند و برعکس!
      ولی نمیدونم باید چکار کنم! 
      ممنون میشم اگر کسی بلده راهنمایی کنه، با تشکر... 
    • توسط dastjerdisf
      با سلام
      در بین اساتید کسی می تونه به من کمک کنه بگه چرا وقتی آدرس سایتم رو می نویسم اتومات این متن رو به اون اضافه می کنه/?i=1
      از مدیریت هاست پرسیدم میگند از کش مرورگر هستش اما چرا سایت های دیگه این جوری نیستند
      آدرس سایتم:http://hushmandyar.ir
    • توسط saeid1872
      سلام دوستان
      تو کمتر از یک ماه سایتم 61 ارور 500 ثبت کرده که در حال زیاد شدن هستش نمیدونم چرا این ارورهارو ثبت میکنه
      لطفا دلیلش رو بگید و اینکه چطور باید رفع کنم
      من خیلی اصلا حرفه ای نیستم فقط خواهشا جوری راهنمایی کنید که بتونم رفعش کنم.