Swap social icons with phone number on home page

This support request was posted in General Support by caspian

Request ID #6479 In Progress
  • Hi,

    I’m trying to figure out how to swap the social icons and the phone number on the home page so that the phone number shows up on mobile. Can anyone help? I don’t know enough php to get it to work.

    I’m looking at these lines on template-home.php and I assume this is where it would be done?

    $home_social_class = ( empty( $social_items ) || $nice_phone_number == ” ) ? ‘home-social-full-width’ : ”;

    if ( ! empty( $social_items ) || $nice_phone_number != ” ) : ?>

    <section class="home-social home-block clearfix”>


    Thanks in advance.

    Juanfra Aldasoro

    Hi,

    Thank you for writing.

    The positioning of those items is given by CSS and has no direct relation with the php code. This cannot be modified through the theme options. What you need to do, in case you want to edit the CSS, would be looking for the classes and changing the floating attribute.

    Best,
    Juan.

    Thanks for the info. Could you tell me how to accomplish what I’m trying? How can I change that html to rearrange the items?

    Juanfra Aldasoro

    Hi,

    Thank you for the follow up. You don’t need to touch the html, you need to re-position the elements with CSS. Unfortunately we cannot give support on customizations: http://nicethemes.com/article/support-vs-customizations/

    Best,
    Juan.

    Can you at least tell me which classes I should modify? That would make this a little easier.

    I just need to get the phone number to appear on the mobile version. The client doesn’t care if the social media icons don’t show up on mobile because he wants people to be able to find his number easily.

    Juanfra Aldasoro

    Hi,

    Thank you for the follow up.

    In order to display that on mobile devices you’d need to include something like this in your theme custom CSS:

    
    @media screen and (max-width: 685px) {
    	.home-social .main-title .right{
    		display: block;
                    width: 100%;
                    text-align: center;
    	}
    }
    

    Best,
    Juan.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

Login to your Account

Welcome back! Please log in to your account by filling the fields below:

Forgot?

Not a member? Create a free account.

Create a Free Account

You're 27 seconds away from some awesome WordPress free stuff, benefits and more. Create a free account and have access to our free products, benefits and more!

Already have an account? Log in
Secure Server