i.gratia

تب css به همراه نمایش مطالب با تصویر شاخص

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

سلام

من چند روزه دارم دنبال tabe میگردم که چند تا پیدا کردم اما با جی کوئری عمل میکرد که وقتی تو سایتم میزاشتم با جی کوئری های دیگه تداخل پیدا میکرد و به هم میریخت

یه جا یه تب دیدیم که فقط html css بود ینی خبری از جی کوئری نبود براتون اینجا گذاشتم که کسی خواست استفاده کنه راحت باشه

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

پیش نمایشو تو این لینک میتونید ببینید


http://jsfiddle.net/igratia/y99VT/

1

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


لینک به پست

سلام

توضیح کد: به جای عدد 2 شماره آی دی دسته دلخواه - به جای 3 تعداد مطالبی که میخواید نمایش داده بشه.

به جای rand ترتیب دلخواه خودتون (برای اطلاعات بیشتر در مورد ترتیب نمایش اینجا کلیک کنید)

به جای دو عدد 50 و 50 هم سایز دلخواه تصویر شاخص شما.


<ul><?php $my_query = new WP_Query('cat=2&showposts=3&orderby=rand');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID; ?>
<!--CUSTOM LOOP STUFF HERE -->
<li>
<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(50,50), array("class" => "")); } ?>
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</li>
<?php endwhile; ?>
</ul>

2

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


لینک به پست


<ul><?php $my_query = new WP_Query('cat=2&showposts=3&orderby=rand');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID; ?>
<!--CUSTOM LOOP STUFF HERE -->
<li>
<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(50,50), array("class" => "")); } ?>
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</li>
<?php endwhile; ?>
</ul>

آقا سجاد ممنون

آین تکه کدی که زحمت کشیدید و جایگزین کدوم یک از دستورات تو قسمت html مطالب بالا کنم ؟؟؟

1

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


لینک به پست

آقا سجاد ممنون

آین تکه کدی که زحمت کشیدید و جایگزین کدوم یک از دستورات تو قسمت html مطالب بالا کنم ؟؟؟

[خوهش میکنم.. نکته: پیشنهاد میشه برای تشکر از دکمه تشکر استفاده کنید ;) ]

کد رو در اینجا بذارید:


<div id="container">
<!-- Start Tabs !-->
<div class="tab-container">
<!-- Use c + the tab number or any other identifier you'd like when creating a new tab, just keep them in order. You can have an unlimited number of tabs !-->
<div id="c1">
<a href="#c1" title="First">First</a> <!-- This is your actual tab and the content is below it !-->
<div class="tab-content"> <!-- tab-container > div > div in the CSS !-->
<div id="main">
اینجا
</div>
</div>
</div>

<div id="c2">
<a href="#c2" title="Second">Second</a> <!-- This is your actual tab and the content is below it !-->
<div class="tab-content"> <!-- tab-container > div > div in the CSS !-->
<div id="main">
اینجا
</div> </div>
</div>
<div id="c3">
<a href="#c3" title="Third">Third</a> <!-- This is your actual tab and the content is below it !-->
<div class="tab-content"> <!-- tab-container > div > div in the CSS !-->
<div id="main">
اینجا
</div> </div>
</div>
<div id="c4">
<a href="#c4" title="Fourth">Fourth</a> <!-- This is your actual tab and the content is below it !-->
<div class="tab-content"> <!-- tab-container > div > div in the CSS !-->
<div id="main">
اینجا
</div> </div>
</div>
</div><!-- Tab Container !-->

</div><!-- Container !-->

هر اینجا مربوط به یک تب است..

3

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


لینک به پست

آقا سجاد ممنون

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

0

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


لینک به پست

این کد نمایش دهنده تصویر شاخص + تیتر مطالبه و متن را همراه نمی آره


<ul class="my-tab"><?php $my_query = new WP_Query('cat=2&showposts=3&orderby=rand');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID; ?>
<!--CUSTOM LOOP STUFF HERE -->
<li>
<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(50,50), array("class" => "tab-thumb")); } ?>
<a href="<?php the_permalink(); ?>" class="tab-title><?php the_title(); ?></a>
</li>
<?php endwhile; ?>
</ul>

کلاس های


my-tab
tab-thumb
tab-title

به ترتیب لایه اصلی تصویر شاخص با ابعاد 50 در 50 و عنوان مطالبند که می تونید تغییرات دلخواه رو روشون اعمال کنید

4

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


لینک به پست

این کد نمایش دهنده تصویر شاخص + تیتر مطالبه و متن را همراه نمی آره

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

در مورد " ادامه مطلب " و محتوای پست چطور ؟؟ چه کدی باید وارد کنم ؟؟

یه مشکل دیگه ای هست اینه که این 5 تا مطلب آخر و یه جا نشون میده دونه دونه کنار هم نمیان مثل اچ تی املی که بالا نشون دادم

ویرایش شده در توسط i.gratia
0

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


لینک به پست

آقا با یه همچین چیزی درست شد استایلش و ما بقی چیزا اساتید اگه مشکلی داره تصحیح کنن تا بقیه دوستان که مثل من مبتدین راحت استفاده کنند


<div id="main-post-tab">
<?php $my_query = new WP_Query('cat=235&showposts=6&orderby=rand');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID; ?>
<!--CUSTOM LOOP STUFF HERE -->
<li id="post-tab">
<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(50,50), array("id" => "img-post-tab")); } ?>
<p id="title-post-tab"><?php the_title(); ?></p>
<p id="content-post-tab"><?php the_content_rss('', TRUE, '', 15); ?></p><p id="more-post-tab"><a href="<?php echo get_permalink(); ?>"> ادامه مطلب</a></p>
</li>
<?php endwhile; ?>
</div>

فقط یه سوال از اینکه از <p> زیاد استفاده کردم ایرادی پیدا نمیکنه ؟؟ منظور از لحاظ استاندارد کد نویسیه

ویرایش شده در توسط i.gratia
0

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


لینک به پست

تگ p برای پاراگراف هست

برای کار شما div مناسبتر هست

2

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


لینک به پست

یه مشکل جدی : دستورات tabe css تو اینترنت اکسپولرر اجرا نمیشه چیکارش کنم ؟؟

0

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


لینک به پست
دستورات tabe css

کدوم دستورات؟

2

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


لینک به پست

همون دستورات css نوشته اولم تو همین تاپیک مطرح کردم

اینجا میتونید ببینید


http://jsfiddle.net/igratia/y99VT/

0

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


لینک به پست

عرض خسته نباشید خدمت دوستان یه مشکلی تو دستور زیر هست که وقتی رفرش میکنیم پست ها به صورت قاطی پاطی کنار هم میان ینی یبار پست اول و دوم دو تا آخرین پست ارسالیه بعد از رفرش دو پست اول د وتا مونده به آخرین ارسال هاس همینجوری در هم نشون میده دلیلش چی میتونه باشه ؟؟؟


<div id="main-post-tab">
<?php $my_query = new WP_Query('cat=235&showposts=6&orderby=rand');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID; ?>
<!--CUSTOM LOOP STUFF HERE -->
<li id="post-tab">
<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(50,50), array("id" => "img-post-tab")); } ?>
<p id="title-post-tab"><?php the_title(); ?></p>
<p id="content-post-tab"><?php the_content_rss('', TRUE, '', 15); ?></p><p id="more-post-tab"><a href="<?php echo get_permalink(); ?>"> ادامه مطلب</a></p>
</li>
<?php endwhile; ?>
</div>

0

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


لینک به پست

استایل را بگذارید بررسی شود

0

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


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

اینجا همه چیش هست


http://jsfiddle.net/igratia/y99VT/

0

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


لینک به پست

اینجا که درست عمل می کنه جایی که مشکل داره باید کدش بررسی بشه

ببخشید سئوالتون بد متوجه شده بودم از کد


&orderby=rand

را حذف کنید

3

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


لینک به پست

ممنون

0

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط jistili1
      سلام دوستان.من اومدم به قول خودم سایتم رو با استفاده از دستور های media query در css ریسپانسیو کردم.سایتم اینه:namavaz.ir.اومدم برای سایز های مختلف device سایت رو تعریف کردم.ولی الان وقتی سایت رو باز میکنید اصلا کاری به مدیاکوئری ها نداره.همون صفحه ای که روی لپتاپم میاره رو روی موبایل میاد زوم بک میکنه.اگه سایز مرورگر رو توی لپتاپ تغییر بدم مدیاکوئری ها کار میکنن ولی روی موبایل مشکل داره.ممنون میشم راهنمائیم کنید.
    • توسط Ali Brm
      سلام خدمت دوستان
      توی قسمت‌های مختلف وردپرس و توی قالب بخشی وجود داره که میشه کلاس CSS یا ID اون رو اضافه کرد. من با کلاس‌ها و ID آشنایی دارم ولی نمی‌دونم چه جوری باید از اون استفاده کرد. اگه امکانش هست یه توضیح با یک مثال بفرمایید.
      ممنون

    • توسط Ali Brm
      سلام دوستان
      بعضی افزونه‌ها میتونن به صورت گرافیکی یا دستی بیان و ظاهر سایت رو تغییر بدن. مثلا با افزونه مداد زرد میشه کلی توی کد ظاهری سایت دست برد.
      من خودم به CSS و HTML آشنایی دارم ولی سوالی که برام پیش میاد اینه که افزونه ای مانند مداد زرد کدهای CSSاش رو کجا مینویسه
      یه مثال کوچیک بزنم. مثلا اگه دستی برم توی کدهای قالبم و دستی روی فایلش یه تغییری ایجاد کنم خب تغییر اعمال میشه ولی وقتی میرم تنظیمات قالب توی وردپرس و ذخیره تنظیمات رو میزنم همه کدهایی که دستی وارد کردم همه میپره. دلیلش رو میدونم اینه که خب کدهای برنامه نویسی این کدها را میسازند برای همین وقتی "ذخیره تنظیمات" زده میشه همه کدها از اول نوشته میشن (تا حدودی)
      ولی سوالم اینه که چرا مداد زرد یا Visual Composer این اتفاق براش نمیوفته. ینی کدهاش رو کجا می‌نویسه که باقی می‌مونه؟
    • توسط Ali Brm
      با سلام خدمت دوستان
      سوالی که داشتم درباره شخصی سازی قالب سایتم است.
      در حال طراحی قالب سایتم هستم و از قالب publisher استفاده میکنم. در بعضی قسمت ها مثلا لوگوی سایت، اطراف آن Padding: 25px وجود داره. به فایل CSS قالب رجوع کردم و این عدد رو به 0px تغییر دادم و بعد از سیو مشکلم حل شد و padding اطراف لوگوی سایتم نبود. مشکل اینجاست که مثلا در تنظیمات قالب با استفاده از خوده ورد پرس و خوده ابزارهای قالب کافیه گزینه "ذخیره تنظیمات" رو بزنم تا همه چی دوباره برگرده و Padding مجدد بوجود میاد. این رو هم میدونم که اینها یک سری کد هستند که با زدن "ذخیره تنظیمات" اجرا میشن و اعدادی که دستی تغییر دادم رو مجدد با تنظیمات از پیش تعریف شده قالب رونوشت میکنن. حالا میخوستم بدونم راه حل چیه؟ این یکی از موارد بود. مثلا شاید بخوام هدر سایتم ارتفاع خاصی داشته باشه یا رنگ متنی رو جدا تغییر بدم. چه جوری میتونم این مشکل رو حل کنم؟
      سعی کردم توضیح واضح باشه اگه گویا نیست دوستان بفرمایند تا بیشتر توضیح بدم.
      ممنون و متشکر
    • توسط ashkan91
      با سلام و خسته نباشید
      موضوع: تغییر دادن رنگ قسمتهای مختلف بدنه یک سایت بدون استفاده از بخش css اضافی وردپرس
      من یک سایت دارم که از یک قالب مادر ارث میبرد . وقتی از قسمت ویرایشگر وردپرس قالب سایتم وارد بخش CSS پوسته مادر سایتم میشوم و اقدام به تغییر کد رنگ قسمتهای مختلف سایتم میکنم متاسفانه رنگ آن قسمتهای مذکور تغییر نمی کند و همچنان قسمتهای مذکور برنگ خودشان هستند علت چه هست؟ و آیا تنظیم جای دیگری را نیز باید تغییر داد یا خیر؟
      حاوی اسکرینشات