Balumba Theme content.php

Basic content.php

PHP
<?php
/**
 * Template part for displaying posts.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Balumba
 */

?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	<header class="entry-header">
		<?php
		if ( is_single() ) :
			the_title( '<h3 class="entry-title, singleTitle"><span class="fa fa-chevron-left"></span> ', ' </h3>' );
		else :
			the_title( '<h2 class="entry-title, singleTitle"><span class="fa fa-chevron-right"></span> <a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
		endif;
                
		if ( 'post' === get_post_type() ) : ?>
		<div class="entry-meta">
			<?php
            balumba_posted_on();
            $categories = get_the_category();
            if ( ! empty( $categories ) ) {
                echo ' <i class="fa fa-bookmark" aria-hidden="true"> </i> <a class="category" href="' . esc_url( get_category_link( $categories[0]->term_id ) ) . '">' . esc_html( $categories[0]->name ) . '</a>';
            }
            ?>
		</div><!-- .entry-meta -->




		<?php
		endif; ?>

                
                <!--Excerp-->
                <?php
                if ( is_single() ){
                    if(has_excerpt($post->ID)){
                        echo '<div class = "deck" >';
                        echo '<p>' . get_the_excerpt() . '</p>';
                        echo '</div><!-- .deck -->';
                    }
                }
                ?>
                
                <!--Featured Image-->
                <?php
                if ( is_single() ) {
                    if (has_post_thumbnail()) { ?>
                        <figure class="featured-image">
                            <?php the_post_thumbnail(); ?>
                        </figure>
                    <?php }
                }
                ?>
                
	</header><!-- .entry-header -->

	<div class="entry-content">
		<?php
        if ( is_single() ) :
			the_content( sprintf(
				/* translators: %s: Name of current post. */
				/*wp_kses( __( 'Continue reading %s <span class="meta-nav fa fa-arrow-right"></span>', 'balumba' ), array( 'span' => array( 'class' => array() ) ) ),*/
				the_title( '<span class="screen-reader-text">"', '"</span>', false )
			) );

			wp_link_pages( array(
				'before' => '<div class="page-links">' . esc_html__( 'Pages:', 'balumba' ),
				'after'  => '</div>',
			) );
			else:
        endif;
		?>
	</div><!-- .entry-content -->

	
</article><!-- #post-## -->

Advanced content.php

PHP
<?php
/**
 * Template part for displaying posts.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Balumba
 */

?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <header class="entry-header">
        <?php
        if ( is_single() ) :
            the_title( '<h3 class="entry-title, singleTitle"><span class="fa fa-chevron-left"></span> ', ' </h3>' );
        else :
            the_title( '<h2 class="entry-title, singleTitle"><span class="fa fa-chevron-right"></span> <a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
        endif;
                
        if ( 'post' === get_post_type() ) : ?>
        <div class="entry-meta">
            <?php
            balumba_posted_on();
            $categories = get_the_category();
            if ( ! empty( $categories ) ) {
                $category_slug = $categories[0]->slug;
                $category_link = esc_url( get_category_link( $categories[0]->term_id ) );
                echo '<a href="' . $category_link . '" class="entry-meta category-' . esc_attr( $category_slug ) . '"></a>';
            }
            ?>
        </div><!-- .entry-meta -->

        <?php
        endif; ?>

        <!--Excerpt-->
        <?php
        if ( is_single() ){
            if(has_excerpt($post->ID)){
                echo '<div class = "deck" >';
                echo '<p>' . get_the_excerpt() . '</p>';
                echo '</div><!-- .deck -->';
            }
        }
        ?>
        
        <!--Featured Image-->
        <?php
        if ( is_single() ) {
            if (has_post_thumbnail()) { ?>
                <figure class="featured-image">
                    <?php the_post_thumbnail(); ?>
                </figure>
            <?php }
        }
        ?>
    </header><!-- .entry-header -->

    <div class="entry-content">
        <?php
        if ( is_single() ) :
            the_content( sprintf(
                /* translators: %s: Name of current post. */
                /*wp_kses( __( 'Continue reading %s <span class="meta-nav fa fa-arrow-right"></span>', 'balumba' ), array( 'span' => array( 'class' => array() ) ) ),*/
                the_title( '<span class="screen-reader-text">"', '"</span>', false )
            ) );

            wp_link_pages( array(
                'before' => '<div class="page-links">' . esc_html__( 'Pages:', 'balumba' ),
                'after'  => '</div>',
            ) );
        endif;
        ?>
    </div><!-- .entry-content -->
</article><!-- #post-## -->

<style>
.entry-meta {
    display: inline-block; /* Ensure entry-meta is inline-block */
    vertical-align: middle; /* Aligns the icon and text vertically */
    margin-left: 10px; /* Add space to the left */
}

.entry-meta::before {
    display: inline-block; /* Ensure the icon is inline-block */
    font-family: 'FontAwesome';
    margin-right: 5px;
    vertical-align: middle; /* Aligns the icon and text vertically */
}

.entry-meta.category-engineering::before {
    content: '\f0ad'; /* Example FontAwesome icon for engineering */
}

.entry-meta.category-game-development::before {
    content: '\f11b'; /* Example FontAwesome icon for game development */
}

.entry-meta.category-art::before {
    content: '\f1fc'; /* Example FontAwesome icon for art */
}

.entry-meta.category-simulation::before {
    content: '\f1b2'; /* Example FontAwesome icon for simulation */
}

.entry-meta.category-code::before {
    content: '\f121'; /* Example FontAwesome icon for code */
}

.entry-meta.category-quotes::before {
    content: '\f10d'; /* Example FontAwesome icon for quotes */
}

.entry-meta.category-videos::before {
    content: '\f03d'; /* Example FontAwesome icon for videos */
}
</style>

Leave a Reply

Your email address will not be published. Required fields are marked *