blog ب wordpress و bootstrap 4 الجزء الثالت


فهاد الجزء الثالت من blog ب wordpress و bootstrap 4 غادي نكملو الملفات ديالنا فغادي نشوفوا كيفاش نزيدو sidebar ديالنا من بعد غادي نشوفوا كيفاش نديرو recherche ديال les articles منبعد غادي نشوفوا كيفاش نقادو الملف لي كيعرض article اختارو المستخدم وغادي نعرضوا معاه لفورم لي كتمكن من إضافة التعليقات.

نظرة سريعة بالفيديو

1- إضافة sidebar لل blog wordpress

فباش نزيد sidebar خصني نزيد widget وباش نزيدها خصني نمشي للملف functions.php ونزيد fonction جديدة كنسميها add_sidebar_widget وكتاخد id منبعد كنزيد fonction register_sidebar لي هي ديال wordpress ولي كتمكني باش نزيد sidebar فكنعطيها لإسم ول id منبعد فقط كنقول بلي قبل من sidebar غادي تكون div وقبل title غادي يكون h3 منبعد كنزيد ل fonction ل action widgets_init لي كتعني ملي les widgets كيتشارجاو الكود لي زدت ف functions.php هو :

                                //add sidebar wiget

function add_sidebar_widget($id){
    register_sidebar(
        array(
            'name' => 'Sidebar',
            'id' => 'sidebar',
            'before_widget' => '<div class="sidebar-widgets">',
            'after_widget' => '</div>',
            'before_title' => '<h3>',
            'after_title' => '</h3>'
        )
    );
}
add_action('widgets_init','add_sidebar_widget');
                            

2- إضافة الملف sidebar.php

منبعد مازدنا sidebar خصني نمشي ونزيد فيها ل widgets لي بغيت فغادي تمشي للأدمن منبعد Apparence ثم Widgets تما  غادي تلقى sidebar تزادت منبعد غادي تزيد فيها ل widget rechercher ,catégories,Articles récents غادي تكليكي على كل widget وتجرها ل sidebar
فدبا ملي زدنا ل widgets ف sidebar خصني ن afficher sidebar باش ندير هادشي غادي نزيد fichier جديد سميه sidebar.php دائما ف dossier blog-theme فيه غادي تكون ال sidebar لي كنتحقق أولا واش active بل fonction is_active_sidebar ولي كتاخد ل id لي عطينا ل sidebar لي هو sidebar منبعد كن afficher sidebar بل fonction  dynamic_sidebar الكود ديال الملف هو :

                                <?php if(is_active_sidebar('sidebar')):?>
    <?php dynamic_sidebar('sidebar');?>
<?php endif;?>
                            

3- إضافة الملف search.php

فباش ندير البحث فلحقل لي زدنا ف sidebar ون afficher résultat خاصني نزيد page لي غادي ت afficher les résultats فغادي نزيد ملف جديد سميه search.php ف wordpress automatiquement غادي ي afficher فيه résultat ديال recherche ملي المستخدم يبحث على شي article فالكود ديالو بحال الكود ديال ال index.php كيتحقق بلي لقى des articles منبعد كيعرضهم الكود ديال الملف هو :

                                <?php get_header();?>
    <div class="container">
        <div class="row">
            <div class="col-md-8">
                <?php if(have_posts()):?>
                    <?php while(have_posts()) : the_post()?>
                        <div class="post">
                            <div class="post-image">
                                <?php the_post_thumbnail();?>
                            </div>
                            <div class="post-data p-1">
                                <p class="text-danger mt-2"> Par: <?php the_author();?> le: <?php the_time('F j,Y g:i a');?></p>
                            </div>
                            <h3 class="post-title"><a href="<?php the_permalink();?>"><?php the_title();?></a></h3>
                            <p class="post-body"><?php the_excerpt();?><a href="<?php the_permalink();?>">Plus...</a></p>
                        </div>
                        <hr>
                    <?php endwhile;?>
                <?php else :?>
                    <?php echo wpautop('Aucun résultat trouvé');?>
                <?php endif;?>
            </div>
            <div class="col-md-4 sidebar">
                <?php get_sidebar();?>
            </div>
        </div>
    </div>
<?php get_footer();?>
                            

4- إضافة الملف single.php

فباش نشوف article كليكيت عليه ف wordpress خص يكون عندي ملف  سميتو single.php فزيد هاد الملف لي فالكود ديالو بحال index.php الفرق هو ف description فهنا كن afficher كلشي بل fonction the_content لي كت afficher texte كامل وعندي ايضا fonction جديدة لي هي comments_template لي كتعرض الفورم باش المستخدم يزيد التعليقات ديالو فدبا الفورم غادي تبان شوية ممقاداش ولكن غادي نردوها كيف كتبان فالفيديو ب css الكود ديال الملف هو :

                                    <?php get_header();?>
    <div class="container">
        <div class="row">
            <div class="col-md-8">
                <?php if(have_posts()):?>
                    <?php while(have_posts()) : the_post()?>
                        <div class="post">
                            <div class="post-image">
                                <?php the_post_thumbnail();?>
                            </div>
                            <div class="post-data p-1">
                                <p class="text-danger mt-2"> Par: <?php the_author();?> le: <?php the_time('F j,Y g:i a');?></p>
                            </div>
                            <h3 class="post-title text-primary"><?php the_title();?></h3>
                            <p class="post-body"><?php the_content();?></p>
                        </div>
                    <?php endwhile;?>
                    <?php comments_template();?>
                <?php else :?>
                    <?php echo wpautop('Aucun résultat trouvé');?>
                <?php endif;?>
            </div>
            <div class="col-md-4 sidebar">
                <?php get_sidebar();?>
            </div>
        </div>
    </div>
<?php get_footer();?>
                                


بحث في الموقع


إشترك للتوصل بالجديد