رفتن به مطلب

درخواست اسلایدر


2raj

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

سلام و عرض ادب خدمت دوستان
بنده دنبال اسلایدر این سایت میگیردم اگر که بدون افزونه باشه ممنون میشم
اگر که این اسلایدر هم نبود حداقل اسلایدری توی همین مایه ها معرفی کنید برای سایت فیلم میخوام
ممنونم ازتون

لینک به ارسال

سلام و درود

 

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

دقیقا کجای قالب هست؟

لینک به ارسال
در 38 دقیقه قبل، naghmesara گفته است :

سلام و درود

 

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

دقیقا کجای قالب هست؟

احتمالا منظورشون همون 6 تصویر سربرگه که حالت شبکه ای داره

لینک به ارسال
در 39 دقیقه قبل، naghmesara گفته است :

سلام و درود

 

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

دقیقا کجای قالب هست؟

بله منظور بنده 6 تصویر سربرگ هست که حالت شبکه ای داره

لینک به ارسال

درود مجدد

 

خوب اون مورد یه لیست از تصاویر هست که یه هاور افکت هم روش گذاشته شده.

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

 

موفق باشید

لینک به ارسال
در 1 دقیقه قبل، naghmesara گفته است :

درود مجدد

 

خوب اون مورد یه لیست از تصاویر هست که یه هاور افکت هم روش گذاشته شده.

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

 

موفق باشید

میشه بفرمائید چطور کدش رو بهمراه استایل کپی کنم چون دقیق نمیدونم چطور کد رو از این قالب در بیارم

لینک به ارسال
در 21 دقیقه قبل، 2raj گفته است :

میشه بفرمائید چطور کدش رو بهمراه استایل کپی کنم چون دقیق نمیدونم چطور کد رو از این قالب در بیارم

این کدهای اچ تی ام ال هست که تصاویر رو با آدرس همون سایت فراخوانی کرده ، متن ها هم لینک داده و همه بخش ها کلاس داره خودش.

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

و البته استایلشون ، هاور ، فونت ها ، و... رو دیگه خودتون باید بهش بدید 

code.txt

 

.................................

مثلا این یک نمونه کد از کلاس هاوری که به تصاویر داده

.top-section li .top-item-details:hover {
  1. right: 0;
  2. opacity: 1;
}
.top-section li .top-item-details {
  1. background: rgba(0, 0, 0, 0.8);
  2. width: 100%;
  3. height: 100%;
  4. text-align: center;
  5. color: white;
  6. padding: 20px 0px;
  7. font-size: 80%;
  8. position: absolute;
  9. z-index: 10;
  10. -webkit-transition: all 0.3s ease-out;
  11. -moz-transition: all 0.3s ease-out;
  12. -ms-transition: all 0.3s ease-out;
  13. -o-transition: all 0.3s ease-out;
  14. transition: all 0.3s ease-out;
  15. right: -50px;
  16. opacity: 0;
}
 
ویرایش شده توسط logomaster
لینک به ارسال
نقل قول

میشه بفرمائید چطور کدش رو بهمراه استایل کپی کنم چون دقیق نمیدونم چطور کد رو از این قالب در بیارم

کدش میشه این:

https://jsfiddle.net/mr3fd0za/

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

 

پاینده باشید

لینک به ارسال
در 13 دقیقه قبل، naghmesara گفته است :

کدش میشه این:

https://jsfiddle.net/mr3fd0za/

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

 

پاینده باشید

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

نمیشه کاری کرد که عنوان نوشته و عکس رو با استفاده از آیدی دسته مربوطه فراخوانی کرد چون توی این کد باید دستی اینکار رو انجام داد

درضمن این کد به شکل زیر در اومد وقتی کد هارو قرار دادم(دارم روی لوکال کار میکنم)

222222.png

لینک به ارسال

راستش مشکلاتی از این نوع با آزمون و خطا و بازی کردن با کدهای css حل می شود.

نکته بعدی اینکه از روی عکس نمیشه فهمید مشکل چی هست. چون توی jsfiddle همون طور که دیدید تقریبا عملکرد صحیح است.

 

موفق باشید

ویرایش شده توسط naghmesara
لینک به ارسال
در 12 دقیقه قبل، naghmesara گفته است :

راستش مشکلاتی از این نوع با آزمون و خطا و بازی کردن با کدهای css حل می شود.

نکته بعدی اینکه از روی عکس نمیشه فهمید مشکل چی هست. چون توی jsfiddle همون طور که دیدید تقریبا عملکرد صحیح است.

 

موفق باشید

مشکل عکس که فک کنم قابل حل باشه
ولی فراخوانی عکس ها , لینک پست ها و... رو چطور از پست ها انجام بدم چون دستی قرار دادن درست نیست

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

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

درود مجدد

 

برای اون قضیه اینکه داینامیک کنید این عکس ها رو باید درون یه حلقه وردپرس قرارش بدید مثل WP_Query به شکل زیر:

 

    <ul class="top-section">
    <?php 
    $args = [
        'posts_per_page' => 6,
        'cat' => 10,
        'ignore_sticky_posts' => 1,
    ];
    $query = new WP_Query($args);
    if($query->have_posts()) :
         while($query->have_posts()) :
            $query->the_post();
    ?>
    <li>
        <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank">
            <img width="164" height="230" src="if(has_post_thumbnail()) the_post_thumbnail_url();" alt="<?php the_title(); ?>"> </a>
        <div class="top-item-details">
            <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
                <span class="type-item"></span>
                <h3><?php the_title(); ?></h3>
            </a>
	            <div class="imdb-rating">
                <span></span>
                <p>بازدید</p>
            </div>
        </div>
    </li>
    <?php
    endwhile;
    wp_reset_postdata();
    endif;
    ?>
</ul>

لینک به ارسال

سلام دوستان عزیز

کسی کد کاملی برای اسلایدر نداره؟

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

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

الان یک هفتس درگیر این کدم نمیخوام از افزونه استفاده کنم

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

باتشکر

لینک به ارسال

درود مجدد

 

نقل قول

سلام دوستان عزیز

کسی کد کاملی برای اسلایدر نداره؟

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

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

الان یک هفتس درگیر این کدم نمیخوام از افزونه استفاده کنم

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

باتشکر

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

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

ویرایش شده توسط naghmesara
لینک به ارسال
در هم اکنون، naghmesara گفته است :

درود مجدد

 

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

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

بله مشکل دارم بدجور و اینکه عکسها نصفس اگر ممکنه کد کلی رو قرار بدید

لینک به ارسال

درود مجدد

 

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

لینک به ارسال
در 1 دقیقه قبل، naghmesara گفته است :

درود مجدد

 

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

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

لینک به ارسال

کد HTML و PHP ایش که همین کد میشه:

<ul class="top-section">
    <?php 
    $args = [
        'posts_per_page' => 6,
        'cat' => 10,
        'ignore_sticky_posts' => 1,
    ];
    $query = new WP_Query($args);
    if($query->have_posts()) :
         while($query->have_posts()) :
            $query->the_post();
    ?>
        <li>
            <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank">
            <img width="164" height="230" src="<?php if(has_post_thumbnail()) the_post_thumbnail_url(); ?>" alt="<?php the_title(); ?>"> </a>
            <div class="top-item-details">
                <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
                    <span class="type-item"></span>
                    <h3><?php the_title(); ?></h3>
                </a>
                <div class="imdb-rating">
                    <span></span>
                    <p>بازدید</p>
                </div>
            </div>
        </li>
        <?php
    endwhile;
    wp_reset_postdata();
    endif;
    ?>
</ul>

کد CSS اش هم این میشه:

.top-section {
    padding: 20px 0px
}

.top-section li {
    float: right;
    display: block;
    width: 14.75%;
    border-radius: 5px;
    overflow: hidden;
    height: 230px;
    position: relative;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    margin: 0px 0px 0px 2.2893333%
}

.top-section #playicon {
    position: absolute;
    top: 90px;
    right: 37%;
    z-index: 15;
    background: #FE8969;
    background: -webkit-linear-gradient(#FE8969, #F1658F);
    background: -o-linear-gradient(#FE8969, #F1658F);
    background: -moz-linear-gradient(#FE8969, #F1658F);
    background: linear-gradient(#FE8969, #F1658F);
    width: 48px;
    border-radius: 99px;
    height: 48px;
    color: white;
    text-align: center;
    padding-top: 15px;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2)
}

.top-section li .top-item-details {
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    text-align: center;
    color: white;
    padding: 20px 0px;
    font-size: 80%;
    position: absolute;
    z-index: 10;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    right: -50px;
    opacity: 0
}

.top-item-details h3 {
    color: white;
    padding: 0px 10px
}

.top-section li .top-item-details:hover {
    right: 0;
    opacity: 1
}

.top-section li .top-item-details a {
    color: white;
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
}

.top-section li .top-item-details a span {
    color: rgba(255, 255, 255, 0.6)
}

.top-section li .imdb-rating {
    bottom: 10px;
    position: absolute;
    text-align: center;
    width: 100%;
    font-size: 110%
}

.top-section li:nth-child(6) {
    margin: 0px 0px 0px 0px !important
}

.top-section li img {
    width: 100%;
    height: 230px;
    position: absolute;
    z-index: 5;
    opacity: 0.85
}

.top-section li:hover img {
    opacity: 1
}

 

موفق باشید

ویرایش شده توسط naghmesara
لینک به ارسال
در 15 دقیقه قبل، naghmesara گفته است :

کد HTML و PHP ایش که همین کد میشه:


<ul class="top-section">
    <?php 
    $args = [
        'posts_per_page' => 6,
        'cat' => 10,
        'ignore_sticky_posts' => 1,
    ];
    $query = new WP_Query($args);
    if($query->have_posts()) :
         while($query->have_posts()) :
            $query->the_post();
    ?>
        <li>
            <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank">
            <img width="164" height="230" src="if(has_post_thumbnail()) the_post_thumbnail_url();" alt="<?php the_title(); ?>"> </a>
            <div class="top-item-details">
                <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
                    <span class="type-item"></span>
                    <h3><?php the_title(); ?></h3>
                </a>
                <div class="imdb-rating">
                    <span></span>
                    <p>بازدید</p>
                </div>
            </div>
        </li>
        <?php
    endwhile;
    wp_reset_postdata();
    endif;
    ?>
</ul>

کد CSS اش هم این میشه:


.top-section {
    padding: 20px 0px
}

.top-section li {
    float: right;
    display: block;
    width: 14.75%;
    border-radius: 5px;
    overflow: hidden;
    height: 230px;
    position: relative;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    margin: 0px 0px 0px 2.2893333%
}

.top-section #playicon {
    position: absolute;
    top: 90px;
    right: 37%;
    z-index: 15;
    background: #FE8969;
    background: -webkit-linear-gradient(#FE8969, #F1658F);
    background: -o-linear-gradient(#FE8969, #F1658F);
    background: -moz-linear-gradient(#FE8969, #F1658F);
    background: linear-gradient(#FE8969, #F1658F);
    width: 48px;
    border-radius: 99px;
    height: 48px;
    color: white;
    text-align: center;
    padding-top: 15px;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2)
}

.top-section li .top-item-details {
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    text-align: center;
    color: white;
    padding: 20px 0px;
    font-size: 80%;
    position: absolute;
    z-index: 10;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    right: -50px;
    opacity: 0
}

.top-item-details h3 {
    color: white;
    padding: 0px 10px
}

.top-section li .top-item-details:hover {
    right: 0;
    opacity: 1
}

.top-section li .top-item-details a {
    color: white;
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
}

.top-section li .top-item-details a span {
    color: rgba(255, 255, 255, 0.6)
}

.top-section li .imdb-rating {
    bottom: 10px;
    position: absolute;
    text-align: center;
    width: 100%;
    font-size: 110%
}

.top-section li:nth-child(6) {
    margin: 0px 0px 0px 0px !important
}

.top-section li img {
    width: 100%;
    height: 230px;
    position: absolute;
    z-index: 5;
    opacity: 0.85
}

.top-section li:hover img {
    opacity: 1
}

 

موفق باشید

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

مشکل از کجاست؟

لینک به ارسال
در هم اکنون، naghmesara گفته است :

یعنی هیچ اروری هم نمیده؟

خیر

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

سایت بنده

لینک به ارسال

آها متوجه شدم.

 

توی کد PHP یه جا نوشته cat رو به روی اون باید آیدی دسته بندی ای رو بزنید که میخواد مطالبش رو کد براتون لیست کنه.

لینک به ارسال
در 9 دقیقه قبل، naghmesara گفته است :

آها متوجه شدم.

 

توی کد PHP یه جا نوشته cat رو به روی اون باید آیدی دسته بندی ای رو بزنید که میخواد مطالبش رو کد براتون لیست کنه.

قالب به این شکل شد یکم رفته به سمت راست و عکسهارو هم نشون نمیده فک کنم تصاویر شاخص رو فراخوانی نمیکنه

Untitled.png

لینک به ارسال

درود مجدد

 

توی کدی که فرستادم اتربیوت src تگ img رو کد درونش رو داخل تگ شروع و پایان php قرار بدید به شکل زیر:

<?php if(has_post_thumbnail()) the_post_thumbnail_url(); ?>

 

پاینده باشید

لینک به ارسال
در 7 دقیقه قبل، naghmesara گفته است :

درود مجدد

 

توی کدی که فرستادم اتربیوت src تگ img رو کد درونش رو داخل تگ شروع و پایان php قرار بدید به شکل زیر:


<?php if(has_post_thumbnail()) the_post_thumbnail_url(); ?>

 

پاینده باشید

عکس رو نصفه نمایش میده خودتون در سایت زیر میتونید مشاهده کنید

سایت بنده

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

لینک به ارسال

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

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

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

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

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

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

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

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

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