Theme Source Code Change - PHP

Hi I am using a 3rd party theme called novelty

It is working without problem except their logo / Website titles issue. Theme is designed to display Website title or logo but I cannot choose both of them.

I've set up a test website @ http://url.bjdch.org/030815 so you could have a quick look for what I am planning to do. Also I've uploaded an attachment FireShot Capture Design.png to make more clearer about what I would like to do.

For your convenience, I've pasted the source code of the header.php and it would be much appreciated if anyone could give me some hint to tweak this theme.

<!DOCTYPE html>

<html <?php language_attributes(); ?>>

<head>

    <meta charset=&quot;<?php bloginfo( 'charset' ); ?>&quot; />

    <meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1, maximum-scale=1&quot; />

    <title><?php wp_title( '|', true, 'right' ); ?></title>

    <link rel=&quot;alternate&quot; type=&quot;application/rss+xml&quot; title=&quot;RSS 2.0&quot; href=&quot;<?php bloginfo('rss2_url'); ?>&quot; />
    <link rel=&quot;alternate&quot; type=&quot;text/xml&quot; title=&quot;RSS .92&quot; href=&quot;<?php bloginfo('rss_url'); ?>&quot; />
    <link rel=&quot;alternate&quot; type=&quot;application/atom+xml&quot; title=&quot;Atom 0.3&quot; href=&quot;<?php bloginfo('atom_url'); ?>&quot; />
    <link rel=&quot;pingback&quot; href=&quot;<?php bloginfo('pingback_url'); ?>&quot; />

    <?php wp_head(); ?>

</head>

<body <?php body_class(); ?>>
    <!-- ======================================================================
                                        START HEADER
    ======================================================================= -->
    <div class=&quot;header&quot;>
        <div class=&quot;container&quot;>
            <div class=&quot;row&quot;>
                <div class=&quot;col-md-4&quot;>
                    <div class=&quot;logo&quot;>
                        <a href=&quot;<?php echo esc_url(home_url()); ?>&quot;>
                            <?php
                                $logo_text = _go('logo_text');
                                if(empty($logo_text)){
                                    $logo_image = _go('logo_image');
                                    if(empty($logo_image))
                                        echo '<strong>'.get_bloginfo('name').'</strong><br/><em>'.get_bloginfo

('description').'</em>';
                                    else
                                        echo '<img src=&quot;'.$logo_image.'&quot; alt=&quot;logo&quot; />';
                                }else{
                                    $logo_text_color = _go('logo_text_color');
                                    if(empty($logo_text_color))
                                        $logo_text_color = '';
                                    else
                                        $logo_text_color = 'color:'.$logo_text_color.';';
                                    $logo_text_font = _go('logo_text_font');
                                    if(empty($logo_text_font))
                                        $logo_text_font = '';
                                    else
                                        $logo_text_font = 'font-family:'.$logo_text_font.';';
                                    $logo_text_size = _go('logo_text_size');
                                    if(empty($logo_text_size))
                                        $logo_text_size = '';
                                    else
                                        $logo_text_size = 'font-size:'.$logo_text_size.'px;';
                                    echo '<span style=&quot;'.$logo_text_color.$logo_text_font.$logo_text_size.'&quot;>'.

$logo_text.'</span>';
                                }
                            ?>
                        </a>
                    </div>
                </div>
                <div class=&quot;col-md-4&quot;>
                    <form class=&quot;subscription&quot; id=&quot;newsletter&quot; method=&quot;post&quot;>
                        <span class=&quot;subscription-text&quot;><?php _ex('Newsletter subscribe', 'header', 'novelty'); ?></span>
                        <span class=&quot;input-cover&quot;>
                            <input type=&quot;submit&quot; value=&quot;&quot; class=&quot;subscription-button&quot;>
                            <input type=&quot;text&quot; name=&quot;email&quot; placeholder=&quot;<?php _ex('Email ...', 'header', 'novelty'); ?>&quot; 

class=&quot;subscription-line&quot; data-tt-subscription-required data-tt-subscription-type=&quot;email&quot;>
                            <div class=&quot;result_container&quot;></div>
                        </span>
                    </form>
                </div>
                <?php
                $novelty_social = array(
                    'facebook'=>_go('social_platforms_facebook'),
                    'twitter'=>_go('social_platforms_twitter'),
                    'linkedin'=>_go('social_platforms_linkedin'),
                    'rss'=>_go('social_platforms_rss'),
                    'pinterest'=>_go('social_platforms_pinterest'),
                    'youtube'=>_go('social_platforms_youtube'),
                    'flickr'=>_go('social_platforms_flickr'),
                    'behance'=>_go('social_platforms_behance'),
                    'dribbble'=>_go('social_platforms_dribbble'),
                    'google'=>_go('social_platforms_google'),
                    'vimeo'=>_go('social_platforms_vimeo')
                );
                $novelty_social_font = array(
                    'facebook'=>'<i class=&quot;fa fa-facebook&quot;></i>',
                    'twitter'=>'<i class=&quot;fa fa-twitter&quot;></i>',
                    'linkedin'=>'<i class=&quot;fa fa-linkedin&quot;></i>',
                    'rss'=>'<i class=&quot;fa fa-rss&quot;></i>',
                    'pinterest'=>'<i class=&quot;fa fa-pinterest&quot;></i>',
                    'youtube'=>'<i class=&quot;fa fa-youtube&quot;></i>',
                    'flickr'=>'<i class=&quot;fa fa-flickr&quot;></i>',
                    'behance'=>'<i class=&quot;fa fa-behance&quot;></i>',
                    'dribbble'=>'<i class=&quot;fa fa-dribbble&quot;></i>',
                    'google'=>'<i class=&quot;fa fa-google-plus&quot;></i>',
                    'vimeo'=>'<i class=&quot;fa fa-vimeo-square&quot;></i>'
                );
                $novelty_social_filtered = array_filter($novelty_social);
                if(!empty($novelty_social_filtered)): ?>
                <div class=&quot;col-md-4&quot;>
                    <ul class=&quot;header-socials&quot;>
                        <?php foreach($novelty_social_filtered as $novelty_social_key => $novelty_social_value): ?>
                            <li><a class=&quot;header-socials-<?php echo $novelty_social_key; ?>&quot; href=&quot;<?php echo 

$novelty_social_value; ?>&quot;><?php echo $novelty_social_font[$novelty_social_key]; ?></a></li>
                        <?php endforeach; ?>
                    </ul>
                </div>
                <?php endif; ?>
            </div>
        </div>

        <div class=&quot;menu site-bg-color&quot;>
            <div class=&quot;container&quot;>
               <!-- <form class=&quot;header-search&quot; action=&quot;<?php echo esc_url( home_url( '/' ) ); ?>&quot;>
                    <input type=&quot;submit&quot; id=&quot;searchsubmit&quot; value=&quot;&quot; class=&quot;header-search-button&quot; />
                    <input type=&quot;text&quot; value=&quot;&quot; name=&quot;s&quot; id=&quot;s&quot; class=&quot;header-search-line&quot; placeholder=&quot;<?php _ex('Search 

...','search form','novelty'); ?>&quot; />
                </form>-->
                <div class=&quot;responsive-menu&quot;>Menu</div>
                <?php wp_nav_menu(array(
                    'theme_location' => 'novelty_menu'
                )); ?>
            </div>
        </div>
    </div>
    <!-- ======================================================================
                                        END HEADER
    ======================================================================= -->

  • Vinod Dalvi

    Hi @bjdchwr,

    I hope you are well today and thank you for your question.

    To display the logo along with site title you can try adding the following modified code replacing the shared code then we can style the site title using CSS code to display it in the middle.

    <!DOCTYPE html>
    
    <html <?php language_attributes(); ?>>
    
    <head>
    
        <meta charset="<?php bloginfo( 'charset' ); ?>" />
    
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    
        <title><?php wp_title( '|', true, 'right' ); ?></title>
    
        <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
        <link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
        <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
        <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    
        <?php wp_head(); ?>
    
    </head>
    
    <body <?php body_class(); ?>>
        <!-- ======================================================================
                                            START HEADER
        ======================================================================= -->
        <div class="header">
            <div class="container">
                <div class="row">
                    <div class="col-md-4">
                        <div class="logo">
                            <a href="<?php echo esc_url(home_url()); ?>">
                                <?php
                                    $logo_text = _go('logo_text');
                                    if(empty($logo_text)){
                                        $logo_image = _go('logo_image');
    										echo '<img src="'.$logo_image.'" alt="logo" />';
                                            echo '<strong>'.get_bloginfo('name').'</strong><br/><em>'.get_bloginfo('description').'</em>';
                                    }else{
                                        $logo_text_color = _go('logo_text_color');
                                        if(empty($logo_text_color))
                                            $logo_text_color = '';
                                        else
                                            $logo_text_color = 'color:'.$logo_text_color.';';
                                        $logo_text_font = _go('logo_text_font');
                                        if(empty($logo_text_font))
                                            $logo_text_font = '';
                                        else
                                            $logo_text_font = 'font-family:'.$logo_text_font.';';
                                        $logo_text_size = _go('logo_text_size');
                                        if(empty($logo_text_size))
                                            $logo_text_size = '';
                                        else
                                            $logo_text_size = 'font-size:'.$logo_text_size.'px;';
                                        echo '<span style="'.$logo_text_color.$logo_text_font.$logo_text_size.'">'.
    
    $logo_text.'</span>';
                                    }
                                ?>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <form class="subscription" id="newsletter" method="post">
                            <span class="subscription-text"><?php _ex('Newsletter subscribe', 'header', 'novelty'); ?></span>
                            <span class="input-cover">
                                <input type="submit" value="" class="subscription-button">
                                <input type="text" name="email" placeholder="<?php _ex('Email ...', 'header', 'novelty'); ?>" 
    
    class="subscription-line" data-tt-subscription-required data-tt-subscription-type="email">
                                <div class="result_container"></div>
                            </span>
                        </form>
                    </div>
                    <?php
                    $novelty_social = array(
                        'facebook'=>_go('social_platforms_facebook'),
                        'twitter'=>_go('social_platforms_twitter'),
                        'linkedin'=>_go('social_platforms_linkedin'),
                        'rss'=>_go('social_platforms_rss'),
                        'pinterest'=>_go('social_platforms_pinterest'),
                        'youtube'=>_go('social_platforms_youtube'),
                        'flickr'=>_go('social_platforms_flickr'),
                        'behance'=>_go('social_platforms_behance'),
                        'dribbble'=>_go('social_platforms_dribbble'),
                        'google'=>_go('social_platforms_google'),
                        'vimeo'=>_go('social_platforms_vimeo')
                    );
                    $novelty_social_font = array(
                        'facebook'=>'<i class="fa fa-facebook"></i>',
                        'twitter'=>'<i class="fa fa-twitter"></i>',
                        'linkedin'=>'<i class="fa fa-linkedin"></i>',
                        'rss'=>'<i class="fa fa-rss"></i>',
                        'pinterest'=>'<i class="fa fa-pinterest"></i>',
                        'youtube'=>'<i class="fa fa-youtube"></i>',
                        'flickr'=>'<i class="fa fa-flickr"></i>',
                        'behance'=>'<i class="fa fa-behance"></i>',
                        'dribbble'=>'<i class="fa fa-dribbble"></i>',
                        'google'=>'<i class="fa fa-google-plus"></i>',
                        'vimeo'=>'<i class="fa fa-vimeo-square"></i>'
                    );
                    $novelty_social_filtered = array_filter($novelty_social);
                    if(!empty($novelty_social_filtered)): ?>
                    <div class="col-md-4">
                        <ul class="header-socials">
                            <?php foreach($novelty_social_filtered as $novelty_social_key => $novelty_social_value): ?>
                                <li><a class="header-socials-<?php echo $novelty_social_key; ?>" href="<?php echo 
    
    $novelty_social_value; ?>"><?php echo $novelty_social_font[$novelty_social_key]; ?></a></li>
                            <?php endforeach; ?>
                        </ul>
                    </div>
                    <?php endif; ?>
                </div>
            </div>
    
            <div class="menu site-bg-color">
                <div class="container">
                   <!-- <form class="header-search" action="<?php echo esc_url( home_url( '/' ) ); ?>">
                        <input type="submit" id="searchsubmit" value="" class="header-search-button" />
                        <input type="text" value="" name="s" id="s" class="header-search-line" placeholder="<?php _ex('Search 
    
    ...','search form','novelty'); ?>" />
                    </form>-->
                    <div class="responsive-menu">Menu</div>
                    <?php wp_nav_menu(array(
                        'theme_location' => 'novelty_menu'
                    )); ?>
                </div>
            </div>
        </div>
        <!-- ======================================================================
                                            END HEADER
        ======================================================================= -->

    Best Regards,
    Vinod Dalvi

  • bjdchwr

    Hi Vinod,

    Sorry for the late reply but the code seems not working. However, I had a little bit play and removed a lot of if... syntax and finally it works. Thanks anyway!!!

    Now I've created 2 divs (logo and title). The problem is: How can I make the title, the text, stays in the middle of the logo with a few px of space using CSS code? It seems that I need to overwrite the property of col-md-4 as well?

    PS: the website is http://url.bjdch.org/030815

    Thanks in advance!

  • Vinod Dalvi

    Hi @bjdchwr,

    The code that i have shared will only work when you don't set text for the logo as from your attached screenshot i thought you wanted to display site title along with the logo.

    You can display the text in the middle of the logo with a few px of space by adding the following CSS code in the style.css file of your child theme or add it in your site using the following plugin.

    https://wordpress.org/plugins/simple-custom-css/

    .header .container .title {
      margin: 60px 0 0 140px;
    }

    Best Regards,
    Vinod Dalvi

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.