Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #113282
    Sumiko Miida
    Participant

    Hi,

    I appreciate if you would advice how to change site-description from single line to double line.
    I checked header.php but couldn’t find tag <!–?php bloginfo( ‘description’ ); ?–>.

    Thank you,
    Sumiko

    #113314
    Pratik
    Participant

    Hi Sumiko,

    Please post in your site url?

    Regards,
    Pratik

    #113450
    Sumiko Miida
    Participant

    Hi Patrik-san,

    I am so sorry for my feedback delay.
    My site url is http://dvcon-japan.com/wordpress/2017/ .

    I would like to change site description “2017年6月30日 新横浜国際ホテル マナーハウス南館” from single line to double or triple line like below.

    2017年6月30日 新横浜国際ホテル マナーハウス南館
    ->

    2017年6月30日 
    新横浜国際ホテル マナーハウス南館

    I appreciate your help.

    Thank you,
    Sumiko

    #113486
    Pratik
    Participant

    Hi @Sumiko,

    Site asks me for password.

    #113517
    Sumiko Miida
    Participant

    Oh goddess…Terribly sorry. The password is dvcon2017.

    #113629
    Pratik
    Participant

    Hi @Sumiko-san(Please do not be mad if I got the honorofic wrong),

    Please try following code in Appearance=> Customize=> Additional CSS box:

    
    #site-description {
        width: 200px;
    }
    

    Increase/decrease 200px to increase/decrease the width so that you can increase/decrease the size of site Site Description.

    Regards,
    Pratik

    #113645
    Sumiko Miida
    Participant

    Hi Patrik-san,

    Thank you for your advice. But since second line will be longer than 1st line, the way doesn’t work well. With this way, the description shows like below;

    2017年6月30日
    新横浜国際ホテル
    マナーハウス南館

    1) can I use “<br>” to change the line?
    2) can I decrease the space between 1st line and 2nd line?
    3) can I move site description lower (mid of header hight)?

    I really appreciate your help.

    Thank you,
    Sumiko

    #113646
    Sumiko Miida
    Participant

    Hi Patrik-san,

    I could solve my question 1) & 2) above!
    Could you give me your advice for 3)? Can I move site-description lower?

    Thank you,
    Sumiko

    #113647
    Sumiko Miida
    Participant

    Sorry again…
    As 1), I tried to add spacing for line arrangement. It shows perfect on PC but not on smartphone.
    So I would like to use <br> for line break. I appreciate your advice…

    Sumiko

    #113649
    Mahesh
    Participant

    @sumiko: This is a bit tricky one, controlling the line break as you using <br /> is not possible here without customization. Though here is the CSS I’ve come up with, hope this helps. If not, I recommend you to hire a customizer to customize the theme further to display the site tagline with line break.

    #site-details {
        margin-top: 45px;
    }
    
    @media screen and (max-width: 960px) and (min-width: 768px) {
        #site-description {
            width: 260px;
        }
        #site-details {
    	margin-top: 55px;
        }
    }
    
    @media screen and (max-width: 767px) {
        #site-description {
            width: 230px;
            visibility: hidden;
        }
    
        #site-description:after {
            content: "2017年6月30日                                              新横浜国際ホテル マナーハウス南館";
            visibility: visible;
            display: block;
            margin-top: -100px;
        }
    }

    Note: Please paste the code as it is or it won’t work.

    Regards,
    Mahesh

    #113662
    Sumiko Miida
    Participant

    Hi Mahesh-san,

    Thank you so much for your advice. But with this css, it shows perfect on smartphone but not on PC.
    I am sorry for bothering you but I appreciate if you would 1 more advice. I understand I cannot use <br/>. Then can I set 2 site-descriptions as css? I wonder whether I can devide this description into 2 as below.

    2017年6月30日
    新横浜国際ホテル マナーハウス南館

    My target is to create site looks like https://dvcon.org/.

    Great thanks,
    Sumiko

    #113677
    Sumiko Miida
    Participant

    Hi Mahesh-san,

    I reconsidered your css advice and Patrik-san’s css, finally I could modified this issue!
    I mixed your css and Patrik-san’s one and arranged pix number as below;

    .home #content .entry-title {
    display: none;
    }

    #site-details {
    margin-top: 45px;
    }
    #site-description {
    width: 400px;
    }


    @media
    screen and (max-width: 960px) and (min-width: 768px) {
    #site-description {
    width: 260px;
    }
    #site-details {
    margin-top: 55px;
    }
    }


    @media
    screen and (max-width: 767px) {
    #site-description {
    width: 230px;
    visibility: hidden;
    }

    #site-description:after {
    content: “2017年6月30日 新横浜国際ホテル マナーハウス南館”;
    visibility: visible;
    display: block;
    margin-top: -50px;
    }
    }

    Then it works perfect now.

    I really appreciate your patient support. You are great!!

    Thank you,
    Sumiko

    #113717
    Mahesh
    Participant

    @sumiko: Glad to know that. Have a nice day!

    Regards,
    Mahesh

Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘change site-description from single line to double line’ is closed to new replies.