FileMaster

Edit File: team-block-with-bio.php

<?php

/**
 * Title: Team block with short bio
 * Slug: fotawp/team-block-with-bio
 * Categories: fotawp-teams
 */
$fotawp_url = trailingslashit(get_template_directory_uri());
$fotawp_images = array(
    $fotawp_url . 'assets/images/team_1.jpg',
    $fotawp_url . 'assets/images/team_2.jpg',
    $fotawp_url . 'assets/images/team_3.jpg',
);
?>

<div class="wp-block-group has-primary-background-color has-background" style="padding-top:80px;padding-right:var(--wp--preset--spacing--50);padding-bottom:100px;padding-left:var(--wp--preset--spacing--50)">
    <div class="wp-block-columns">
        <div class="wp-block-column">
            <h1 class="wp-block-heading has-text-align-left has-foregound-alt-color has-text-color" style="font-size:44px;font-style:normal;font-weight:600"><?php echo esc_html_e('Our Teams', 'fotawp') ?></h1>
            
        </div>

<div class="wp-block-column">
            <p class="has-background-alt-color has-text-color has-link-color"><?php echo esc_html_e('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.', 'fotawp') ?></p>

<div class="wp-block-buttons">
                <div class="wp-block-button is-style-button-hover-secondary-bgcolor"><a class="wp-block-button__link has-primary-color has-foregound-alt-background-color has-text-color has-background has-link-color wp-element-button"><?php echo esc_html_e('Meet All Members', 'fotawp') ?></a></div>
                
            </div>
            
        </div>
        
    </div>

<div class="wp-block-columns" style="margin-top:var(--wp--preset--spacing--70)">
        <div class="wp-block-column">
            <div class="wp-block-group has-foregound-alt-background-color has-background" style="border-radius:10px;padding-top:var(--wp--preset--spacing--60);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--60)">
                <figure class="wp-block-image aligncenter size-full is-resized has-custom-border"><img src="<?php echo esc_url($fotawp_images[0]) ?>" alt="" class="wp-image-42" style="border-radius:50%;aspect-ratio:1;object-fit:cover;width:150px" /></figure>

<div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div>

<h4 class="wp-block-heading has-text-align-center" style="font-style:normal;font-weight:500"><?php echo esc_html_e('John Doe', 'fotawp') ?></h4>

<h6 class="wp-block-heading has-text-align-center has-text-color has-small-font-size" style="color:#7d7d7d;font-style:normal;font-weight:300"><?php echo esc_html_e('Software Engineer', 'fotawp') ?></h6>

<ul class="wp-block-social-links aligncenter has-icon-color has-icon-background-color" style="margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40)">

</ul>

<p class="has-text-align-center has-sub-heading-color-color has-text-color has-small-font-size"><?php echo esc_html_e('The placeholder text, beginning with the line&nbsp;Lorem ipsum dolor sit amet, consectetur adipiscing elit.', 'fotawp') ?></p>
                
            </div>
            
        </div>

<div class="wp-block-column">
            <div class="wp-block-group has-foregound-alt-background-color has-background" style="border-radius:10px;padding-top:var(--wp--preset--spacing--60);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--60)">
                <figure class="wp-block-image aligncenter size-full is-resized has-custom-border"><img src="<?php echo esc_url($fotawp_images[1]) ?>" alt="" class="wp-image-42" style="border-radius:50%;aspect-ratio:1;object-fit:cover;width:150px" /></figure>

<div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div>

<h4 class="wp-block-heading has-text-align-center" style="font-style:normal;font-weight:500"><?php echo esc_html_e('Marcus Henry', 'fotawp') ?></h4>

<h6 class="wp-block-heading has-text-align-center has-text-color has-small-font-size" style="color:#7d7d7d;font-style:normal;font-weight:300"><?php echo esc_html_e('DevOps Engineer', 'fotawp') ?></h6>

</ul>

<div class="wp-block-column">
            <div class="wp-block-group has-foregound-alt-background-color has-background" style="border-radius:10px;padding-top:var(--wp--preset--spacing--60);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--60)">
                <figure class="wp-block-image aligncenter size-full is-resized has-custom-border"><img src="<?php echo esc_url($fotawp_images[2]) ?>" alt="" class="wp-image-42" style="border-radius:50%;aspect-ratio:1;object-fit:cover;width:150px" /></figure>

<div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div>

<h4 class="wp-block-heading has-text-align-center" style="font-style:normal;font-weight:500"><?php echo esc_html_e('Liyana Tobe', 'fotawp') ?></h4>

</ul>

Back