Home Forums Pro Themes Kids Education Pro Meet Our Teachers layout

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #89842
    Sue Pheasey
    Participant

    I’ve set up Meet Your Teacher, but when you click on the link, the layout of the page it takes you to is very different from that in the demo. How can I change the layout of the page so that it looks the same as the demo option. I don’t want the large image of me at the top but in a white box at the side as in the demo image.

    This is my page:
    http://www.teachersgem.co.uk/?tp-team=sue-pheasey-2

    This is the demo page:
    https://themepalace.com/theme-demo/?demo=VVNiRlVNZzNhRjNRYVRIRHluT2hWZz09

    Thanks

    #89868
    Sue Pheasey
    Participant

    I think I’ve fixed it by removing the featured image and inserting an image gallery in the main body.

    #89873
    Sue Pheasey
    Participant

    Not fixed… I realised after removing the featured image that it affected the way it looked on the homepage, so back to square one!

    Anyone help me with the above issue?

    I also have an issue with it displaying the author of the post, which I don’t really want at the bottom of each the teacher description page, or at the bottom of every page that I post.

    #89894
    wensolutions
    Keymaster

    Hello,

    To resolve the issue please once try to upload the image of the size “215X375 px”.

    As for the second issue, please add below-given CSS by going to Admin Panel > Appearance > Customize > Additional CSS.

    .single-tp-team .about-author {
        display: none;
    }

    Hope this helps.

    Regards!!

    #89933
    Sue Pheasey
    Participant

    Thank you for your help. I have resolved the above issue. 🙂

    Is there also a way of removing the author from the ‘Classes’ pages? So similar to above but on different pages.

    Also, is there a way of making the images that appear on pages and classes smaller? Do you have optimum width and height for all images?

    In addition the layout of the Meet Your Teacher on the home-page isn’t good as it is against the left margin instead of being central. Is there a way to fix this? Also I can’t get the image to line up correctly inside the circle.

    Many thanks for your help.

    #89945
    wensolutions
    Keymaster

    Hello,

    To remove the admin section in classes add below given CSS.

    .tp-class .about-author {
        display: none;
    }

    Now to align the picture at the center add below given CSS.

    .modern-design .team-img img {
        margin-top: -29px;
    }

    As for displaying the member at the center add below given CSS.

    @media screen and (min-width: 992px){
    #team-members .four-columns .column-wrapper {
        margin: 0 auto;
        float: none;
    }
    }

    But in case if you add other team members then please remove the CSS above as it will only work for one team member.

    Thank you.

    Regards!!

    #89972
    Sue Pheasey
    Participant

    Thank you so much for taking the time to help me.

    I’ve fixed the problems and you have helped me to understand a little more about coding.

    I have another layout issue that I need help with…

    In both pages and classes when I insert a heading there is a large gap between the heading and the paragraph below. Is there a way of removing the space so that it looks better?

    Here is an example: http://www.teachersgem.co.uk/?page_id=90

    Thank you

    #89981
    wensolutions
    Keymaster

    Hello,

    Glad we could help you.

    Now to remove the gapping please add below given CSS.

    .raleway-poppins h6{
    	    margin: 0;
    }

    Hope this helps.

    Best Regards!!

    #89989
    Sue Pheasey
    Participant

    Thank you so much for all your help.

    #90029
    wensolutions
    Keymaster

    Hello,

    Glad we could help you.

    If you have any issues further please let us know.

    Thank you.

    Regards!!

    #90381
    Sue Pheasey
    Participant

    Please could you tell me – is there a code I can insert to make the heading slider move a little slower?

    #90392
    wensolutions
    Keymaster

    Hello,

    Please add below code in your child theme functions.php file.

    function kids_education_pro_render_slider_section( $content_details = array() ) {
            $options          = kids_education_pro_get_theme_options();
            $read_more_button = $options['main_slider_learn_more_text'];
     
            $content_type          = $options['main_slider_type'];
            $slider_effect         = ( $options['main_slider_type'] == 'demo' ) ? 'cubic-bezier(0.250, 0.100, 0.250, 1.000)' : $options['slider_content_effect'];
            $slider_control        = ( $options['enable_slider_controls'] == true ) ? 'true' : 'false';
            $slider_dragable       = ( $options['enable_slider_dragable'] == true ) ? 'true' : 'false';
            $slider_pause          = ( $options['slider_pause_on_hover'] == true ) ? 'true' : 'false';
            $slider_divider_enable = $options['slider_divider_enable'];
     
            if( $content_type == 'demo' ) {
                $data_slick_value = '{"slidesToShow": 1, "slidesToScroll": 1, "infinite": true, "speed": 8000, "dots": false, "arrows": true, "autoplay": true, "fade": false }';
            }
            else {
                $data_slick_value = '{"slidesToShow": 1, "slidesToScroll": 1, "infinite": true, "speed": 800, "dots": false, "autoplay": true, "pauseOnHover":'. esc_attr( $slider_pause ).', "arrows": '. esc_attr( $slider_control ).', "draggable":'.esc_attr( $slider_dragable ).', "fade": false }';
            }
     
            if ( empty( $content_details ) ) {
                return;
            } ?>
            <section id="main-slider">
                <div class="regular" data-effect="<?php echo esc_attr( $slider_effect ); ?>" data-slick=<?php echo "'" . $data_slick_value . "'"; ?>>
     
                    <?php foreach ($content_details as $content_detail ) : ?>
                    <div class="slider-item" style="background-image: url('<?php echo esc_url( $content_detail['img_array'][0] ); ?>')">
                        <a href="<?php echo esc_url( $content_detail['url'] ); ?>">
                        <div class="black-overlay"></div></a>
                        <div class="main-slider-contents">
                            <?php if( !empty( $content_detail['title'] ) ){ ?>
                                <h2 class="title"><a href="<?php echo esc_url( $content_detail['url'] ); ?>"><?php echo esc_html( $content_detail['title'] );?></a></h2>
                            <?php }
                            if( !empty( $content_detail['content'] ) ){ ?>
                                <p><?php echo esc_html( $content_detail['content'] );?></p>
                            <?php }
                                $learn_more_link = ( 'demo' == $content_type ) ? '#' : $content_detail['url'];
     
                            if( !empty( $read_more_button ) ) :
                            ?>
                            <a href="<?php echo esc_url( $learn_more_link ); ?>" class="btn btn-default"><?php echo esc_html( $read_more_button );?></a>
                            <?php endif; ?>
                        </div><!-- .main-slider-contents -->
                    </div><!-- .slider-item -->
                    <?php endforeach; ?>
     
                </div><!-- .regular -->
                <?php if( $slider_divider_enable ) : ?>
                <div class="divider">
                    <img src="<?php echo get_template_directory_uri() .'/assets/uploads/slider-divider.png'; ?>" alt="<?php esc_attr_e( 'Slider divider', 'kids-education-pro' ); ?>">
                </div><!-- .divider -->
                <?php endif; ?>
            </section><!-- #main-slider -->      
    <?php
        }

    Hope this helps.

    Regards!!

    #94733
    Sue Pheasey
    Participant

    Thank you for your reply above. Unfortunately, I have been unable to do this as I don’t know how to find my child theme functions.php file. Needless to say, I have just put off doing this!

    Is it possible to give me a bit more information of how to go about this.

    Kind regards
    Sue

    #95859
    wensolutions
    Keymaster

    Hello,

    You need to create the child theme and for this you can refer to below given link:

    https://wptravel.io/how-to-create-a-child-theme/

    After activating the child theme you will find the functions.php file inside the child theme folder if you have created using the plugin. As for the manual process you need to create the functions.php file yourself and then paste the code.

    Hope this clears the confusion.

    Thank you.

Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.