رفتن به مطلب

samira127

عضو سایت
  • تعداد ارسال‌ها

    11
  • تاریخ عضویت

  • آخرین بازدید

نوشته‌ها ارسال شده توسط samira127

  1. در در ۱۳۹۸/۴/۱۶ at 17:07، amirjahangiri گفته است :
    
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <!------ Include the above in your HEAD tag ---------->
    
    <!--Container-->
    <div class="container">
        <div class="row mb-2">
            <div class="col-12 text-center pt-3">
                <h1>Bootstrap 4 News Magazine Carousel</h1>
                <p>This is a basic bootstrap sorce code for make responsive magazine big grid cover with carousel</p>
                <h4>You like this snippet ? click like button</h4>
            </div>
        </div>
        
        <!--Start code-->
        <div class="row">
            <div class="col-12 pb-5">
                <!--SECTION START-->
                <section class="row">
                    <!--Start slider news-->
                    <div class="col-12 col-md-6 pb-0 pb-md-3 pt-2 pr-md-1">
                        <div id="featured" class="carousel slide carousel" data-ride="carousel">
                           
    					    <ol class="carousel-indicators">
    						<?php
    						$args = array(
    							'post_type' => 'nameposttype',
    							'order'   => 'ASC',
    							'cat' => 'cat1', 'cat2',
    							'tag' => 'tag1', 'tag2',
    						);
    						$query = new WP_Query( $args );
    						?>
    						<?php if($query->have_posts()) : ?>
    							<?php $i = 0; ?>
    							<?php while($query->have_posts()) : $query->the_post() ?>
    								<li data-target="#carousel-example-generic" data-slide-to="<?php echo $i ?>" class="<?php if($i === 0): ?>active<?php endif; ?>"></li>
    								<?php $i++; ?>
    							<?php endwhile ?>
    						<?php endif ?>
    						<?php wp_reset_postdata(); ?>
    					</ol>
                           
    						
                            <div class="carousel-inner">
                                <!--Item slider-->
    							 <?php
    								$args = array(
    									'post_type' => 'nameposttype',
    									'order'   => 'ASC',
    									'cat' => 'cat1', 'cat2',
    									'tag' => 'tag1', 'tag2',
    								);
    								$query = new WP_Query( $args );
    								?>
    								<?php if($query->have_posts()) : ?>
    								<?php $i = 0; ?>
    								<?php while($query->have_posts()) : $query->the_post() ?>
    								 <div class="item <?php if($i === 0): ?>active<?php endif; ?>">
                                    <div class="card border-0 rounded-0 text-light overflow zoom">
                                        <div class="position-relative">
                                            <!--thumbnail img-->
                                            <div class="ratio_left-cover-1 image-wrapper">
                                                <a href="<?php the_permalink();?>">
                                                   <?php the_post-thumbnail();?>
                                                </a>
                                            </div>
                                            <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                                <!--title-->
                                                <a href="<?php the_permalink();?>">
                                                    <h2 class="h3 post-title text-white my-1"><?php the_title();?></h2>
                                                </a>
                                                <!-- meta title -->
                                                <div class="news-meta">
                                                    <span class="news-author">by <a class="text-white font-weight-bold" href="<?php the_permalink();?>"><?php the_author();?></a></span>
                                                    <span class="news-date"><?php the_time('d‌ F‌ Y');?></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
    								 <?php $i++; ?>
    								<?php endwhile ?>
    								<?php endif ?>
    								<?php wp_reset_postdata(); ?>
                                </div>
                                 
                              <!--end item slider-->
                            </div>
                            <!--end carousel inner-->
                        </div>
                        
                        <!--navigation-->
                        <a class="carousel-control-prev" href="#featured" role="button" data-slide="prev">
                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="carousel-control-next" href="#featured" role="button" data-slide="next">
                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                    </div>
    				
                    <!--End slider news-->
                    
                    <!--Start box news-->
                    <div class="col-12 col-md-6 pt-2 pl-md-1 mb-3 mb-lg-4">
                        <div class="row">
                            <!--news box-->
                            <div class="col-6 pb-1 pt-0 pr-1">
                                <div class="card border-0 rounded-0 text-white overflow zoom">
                                    <div class="position-relative">
                                        <!--thumbnail img-->
                                        <div class="ratio_right-cover-2 image-wrapper">
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <img class="img-fluid"
                                                     src="https://bootstrap.news/source/img5.jpg"
                                                     alt="Image description">
                                            </a>
                                        </div>
                                        <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                            <!-- category -->
                                            <a class="p-1 badge badge-primary rounded-0" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Lifestyle</a>
    
                                            <!--title-->
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <h2 class="h5 text-white my-1">Should you see the Fantastic Beasts sequel?</h2>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <!--news box-->
                            <div class="col-6 pb-1 pl-1 pt-0">
                                <div class="card border-0 rounded-0 text-white overflow zoom">
                                    <div class="position-relative">
                                        <!--thumbnail img-->
                                        <div class="ratio_right-cover-2 image-wrapper">
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <img class="img-fluid"
                                                     src="https://bootstrap.news/source/img6.jpg"
                                                     alt="Image description">
                                            </a>
                                        </div>
                                        <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                            <!-- category -->
                                            <a class="p-1 badge badge-primary rounded-0" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Motocross</a>
                                            <!--title-->
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <h2 class="h5 text-white my-1">Three myths about Florida elections recount</h2>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <!--news box-->
                            <div class="col-6 pb-1 pr-1 pt-1">
                                <div class="card border-0 rounded-0 text-white overflow zoom">
                                    <div class="position-relative">
                                        <!--thumbnail img-->
                                        <div class="ratio_right-cover-2 image-wrapper">
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <img class="img-fluid"
                                                     src="https://bootstrap.news/source/img7.jpg"
                                                     alt="Image description">
                                            </a>
                                        </div>
                                        <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                            <!-- category -->
                                            <a class="p-1 badge badge-primary rounded-0" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Fitness</a>
                                            <!--title-->
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <h2 class="h5 text-white my-1">Finding Empowerment in Two Wheels and a Helmet</h2>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <!--news box-->
                            <div class="col-6 pb-1 pl-1 pt-1">
                                <div class="card border-0 rounded-0 text-white overflow zoom">
                                    <div class="position-relative">
                                        <!--thumbnail img-->
                                        <div class="ratio_right-cover-2 image-wrapper">
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <img class="img-fluid"
                                                     src="https://bootstrap.news/source/img8.jpg"
                                                     alt="Image description">
                                            </a>
                                        </div>
                                        <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                            <!-- category -->
                                            <a class="p-1 badge badge-primary rounded-0" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Adventure</a>
                                            <!--title-->
                                            <a href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
                                                <h2 class="h5 text-white my-1">Ditch receipts and four other tips to be a shopper</h2>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--end news box-->
                        </div>
                    </div>
                    <!--End box news-->
                </section>
                <!--END SECTION-->
            </div>
        </div>
        <!--end code-->
        
    </div>

    با سلام

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

    سلام برای من این کار نمیکنه چه باید بکنم باید فایلی از js ذخیره کنم


  2. من یک اسلایدر زدم با jsولی نمیشه وقتی اسلاید میشه ب صورت scrollو ul  نه اسلایدی اینم کد html


    <div class="col-12 col-md-6 pb-0 pb-md-3 pt-2 pr-md-1">
                        <div id="featured" class="carousel slide carousel" data-ride="carousel">
                            ّ <div id="dots" class="carousel-indicators">
                                <span class="dot active" data-target="#carousel-example-generic"></span>
                            </div>
                            <div id="slider">
                                <!--Item slider-->
                                <?php
                                $args = array(
                                    'posts_per_page' => 5,
                                    'cat' => 10,
                                );
                                $query = new WP_Query($args);
                                ?>
                                <?php if ($query->have_posts()) : ?>
                                <?php $i = 0; ?>
                                <?php while ($query->have_posts()) : $query->the_post() ?>
                                <div class="slide active">
                                    <div class="card border-0 rounded-0 text-light overflow zoom">
                                        <div class="position-relative">
                                            <!--thumbnail img-->
                                            <div class="ratio_left-cover-1 image-wrapper overflow">
                                                <a href="<?php the_permalink(); ?>">
                                                    <?php
                                                            $src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full', false);
                                                            ?>
                                                    <?php the_post_thumbnail("w-100 img-thumbnail mx-auto d-block overflow"); ?>

                                                </a>
                                            </div>
                                            <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                                <!--title-->
                                                <a href="<?php the_permalink(); ?>">
                                                    <h2 class="h3 post-title text-white my-1"><?php the_title(); ?></h2>
                                                </a>
                                                <!— meta title —>
                                                <div class="news-meta">
                                                    <span class="news-author">by <a class="text-white font-weight-bold" href="<?php the_permalink(); ?>"><?php the_author(); ?></a></span>
                                                    <span class="news-date"><?php the_time('d‌ F‌ Y'); ?></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <?php endwhile ?>
                                <?php endif ?>
                                <?php wp_reset_postdata(); ?>
                                <!--end item slider-->
                            </div>
                        </div>
                        <!--end carousel inner-->
                        <!--navigation-->
                        <a class="carousel-control-prev prev" href="#featured" role="button" data-slide="prev">
                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="carousel-control-next next" href="#featured" role="button" data-slide="next">
                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                        <script type="text/javascript">

                        </script>
                    </div>


    اینم کد js


    var slide = document.getElementsByClassName('slide');
    var dot = document.getElementsByClassName('dot');
    var prev = document.querySelector('.prev');
    var next = document.querySelector('.next');
    var n = 0;
    var i;

    function disno(){
        for( i = 0 ; i<slide.length ; i++){
            slide.style.display = 'none';
        }
    }

    function no_active(){
        for( i = 0 ; i<dot.length ; i++){
            dot.classList.remove('active');
        }
    }

    next.addEventListener('click',function(e){
        e.preventDefault();
        n++;
        if( n > slide.length - 1){ // length starts From 1
            n = 0; // Arrays Starts From zero
        }
        disno();
        no_active()
        slide[n].style.display = 'block';
        dot[n].classList.add('active');
    })

    prev.addEventListener('click',function(e){
        e.preventDefault();
        n--;
        if( n < 0){ // length starts From 1
            n = slide.length - 1; // Arrays Starts From zero
        }
        disno();
        no_active()
        slide[n].style.display = 'block';
        dot[n].classList.add('active');
    })

    setInterval(function(){
        n++;
        if( n > slide.length - 1){ // length starts From 1
            n = 0; // Arrays Starts From zero
        }
        disno();
        no_active()
        slide[n].style.display = 'block';
        dot[n].classList.add('active');
    },3000)

    photo_2019-08-27_18-22-03.jpg

    photo_2019-08-27_18-22-18.jpg

    photo_2019-08-27_18-31-01.jpg

  3. سلام می تونید کمک کنید منم همچین مشکلی دارم و اسلایدر من کار نمی کنه به صور ت scroll نه اسلایدر چه باید کنم چه متن چه عکس

    کد html
    <div class="col-12 col-md-6 pb-0 pb-md-3 pt-2 pr-md-1">
                        <div id="featured" class="carousel slide carousel" data-ride="carousel">
                            ّ <div id="dots" class="carousel-indicators">
                                <span class="dot active" data-target="#carousel-example-generic"></span>
                            </div>
                            <div id="slider">
                                <!--Item slider-->
                                <?php
                                $args = array(
                                    'posts_per_page' => 5,
                                    'cat' => 10,
                                );
                                $query = new WP_Query($args);
                                ?>
                                <?php if ($query->have_posts()) : ?>
                                <?php $i = 0; ?>
                                <?php while ($query->have_posts()) : $query->the_post() ?>
                                <div class="slide active">
                                    <div class="card border-0 rounded-0 text-light overflow zoom">
                                        <div class="position-relative">
                                            <!--thumbnail img-->
                                            <div class="ratio_left-cover-1 image-wrapper overflow">
                                                <a href="<?php the_permalink(); ?>">
                                                    <?php
                                                            $src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full', false);
                                                            ?>
                                                    <?php the_post_thumbnail("w-100 img-thumbnail mx-auto d-block overflow"); ?>

                                                </a>
                                            </div>
                                            <div class="position-absolute p-2 p-lg-3 b-0 w-100 bg-shadow">
                                                <!--title-->
                                                <a href="<?php the_permalink(); ?>">
                                                    <h2 class="h3 post-title text-white my-1"><?php the_title(); ?></h2>
                                                </a>
                                                <!— meta title —>
                                                <div class="news-meta">
                                                    <span class="news-author">by <a class="text-white font-weight-bold" href="<?php the_permalink(); ?>"><?php the_author(); ?></a></span>
                                                    <span class="news-date"><?php the_time('d‌ F‌ Y'); ?></span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <?php endwhile ?>
                                <?php endif ?>
                                <?php wp_reset_postdata(); ?>
                                <!--end item slider-->
                            </div>
                        </div>
                        <!--end carousel inner-->
                        <!--navigation-->
                        <a class="carousel-control-prev prev" href="#featured" role="button" data-slide="prev">
                            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="carousel-control-next next" href="#featured" role="button" data-slide="next">
                            <span class="carousel-control-next-icon" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                        <script type="text/javascript">

                        </script>
                    </div>


    اینم کد js


    var slide = document.getElementsByClassName('slide');
    var dot = document.getElementsByClassName('dot');
    var prev = document.querySelector('.prev');
    var next = document.querySelector('.next');
    var n = 0;
    var i;

    function disno(){
        for( i = 0 ; i<slide.length ; i++){
            slide.style.display = 'none';
        }
    }

    function no_active(){
        for( i = 0 ; i<dot.length ; i++){
            dot.classList.remove('active');
        }
    }

    next.addEventListener('click',function(e){
        e.preventDefault();
        n++;
        if( n > slide.length - 1){ // length starts From 1
            n = 0; // Arrays Starts From zero
        }
        disno();
        no_active()
        slide[n].style.display = 'block';
        dot[n].classList.add('active');
    })

    prev.addEventListener('click',function(e){
        e.preventDefault();
        n--;
        if( n < 0){ // length starts From 1
            n = slide.length - 1; // Arrays Starts From zero
        }
        disno();
        no_active()
        slide[n].style.display = 'block';
        dot[n].classList.add('active');
    })

    setInterval(function(){
        n++;
        if( n > slide.length - 1){ // length starts From 1
            n = 0; // Arrays Starts From zero
        }
        disno();
        no_active()
        slide[n].style.display = 'block';
        dot[n].classList.add('active');
    },3000)

    photo_2019-08-27_18-22-03.jpg

    photo_2019-08-27_18-22-18.jpg

    photo_2019-08-27_18-31-01.jpg

  4. سلام من از سایت bootestrapsnipp یک اسلایدر را دانود و جای گذاری کردم ولی الان می خوام با پشتیبانی وردپرس نبدیل کنم لطفا کمک کنید به صورت که برای category خاصی باشد و فقط از مثلا از مد و فشن نمایش دهد https://bootsnipp.com/snippets/1d3X9

  5. در 18 ساعت قبل، d_future گفته است :

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

    نیاز به یک نویسنده حرفه ای و با سابقه به همراه نمونه کار جهت تدوین حدود 20 مقاله در هر ماه دارم (به صورت مداوم و همیشگی)، دوستانی که تمایل دارند پ.خ ارسال کنید.

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

     

  6. با سلام می تونین منودر مورد علامت این نوع گزینه خوانایی در وردپرس راهنمایی نمایید به این صورت که 

    نمره بد سئو1 زیرسربرگ دنبال می شود توسط بیش از حداکثر توصیه شده از 300 کلمات است. زیرسربرگ دیگری وارد کنید. این متن یه علامت چشم در روبه رودارد که نمایش جایی که باید 300 تا کلمه سر تیتر چدید بخورد را نمایش می دهد ولی من علامتش را نمی دبینم چی علامتش؟

    مثلا علامت این متن 

    نمره بد سئو67.3% از جمله حاوی بیش از 20 کلمات است، که بیش از حداکثر پیشنهادی 25% است. جملات را  کوتاه‌تر کنید 

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

     

    با تشکر

     

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