JumpStart 2, Beta 3 – Header Text

[Ron]

Loving JS2|B3. Thanks Jason.

1) Bug?: There appears to be a bug in the text generated for the Header Text field (Theme Options->Layout->Header). When adding additional Fontawesome icons/text using the %FA-icon% tag, after the 2nd icon/text pair, JS appears to be adding additional random blank

<li><li>

pairs under the

<ul class="list-inline">

set. This mucks up formatting particularly in mobile sizing.

2) Possible Bug/Request: It would be very useful to have either/both:

an “Image + Site Title” and “Image + Site Title + Tagline” option under Header Logo(s)
(Theme Options->Layout->Header)
-or-
a “Custom Color + Text” option under Apply Header Background
(Theme Options->Styles->Header)

Often corporate logos do not have the Name of the Corporation in the Logo (but both need to be displayed in the header), and it’s also useful to have the Title and Tagline scale/wrap etc in responsive sizing. (Still trying to figure out the best work-around for this)

Ron B in Boulder

Topic

[Jason Bobich]

Hello Ron,

1) I’m not able to produce what you’re describing on my end. Maybe I’m misunderstand — Can you give me a specific example of the text string you’re putting into the header text option?

2) This is where things start to get tricky and really depend on the specific circumstance you’re working with. I’ve learned over time that trying to give the user too many combinations of options for a given element becomes confusing for many, and makes the code needed to display it more, unnecessarily complex. Specifically, these various little items in the header I try to keep simple so they can moved around and used in different ways with different theme bases and child themes.

If you’re creating a logo that is more complex than the options five you, I would suggest making this customization from a child theme. Once you being to understand how actions work in WordPress, you’ll see that Jump Start makes it super easy to hook in your own piece of content.

First, see the map: http://dev.themeblvd.com/tutorial/primary-framework-action-hooks/

And so from your child theme’s functions.php, you could have something like this:

function my_header_logo() {
	echo '<div class="my-logo">';
	echo '<img src="'.get_stylesheet_directory_uri().'/assets/img/logo.png" />';
	echo '<span class="desc">My Description</span>';
	echo '</div>';
}
add_action('themeblvd_header_logo', 'my_header_logo');
remove_action('themeblvd_header_logo', 'themeblvd_header_logo_default');

[Ron]

Hi Jason,

1) The code I’m putting in Theme Options->Layout->Header->Header Text field:

%phone% 1.720.379.6033 %envelope% <a style="color:#B8D05F" href="mailto:Info@BoulderPotteryLab.org?subject=Request for Information from Boulder Pottery Lab Website">Info@BoulderPotteryLab.org</a> %clock-o% Open Lab Hours %map-marker% Map|Parking

seems to yield:

<ul class="list-inline">
    <li>
        <i class="fa fa-phone"></i> 1.720.379.6033
    </li>
    <li>
        <i class="fa fa-envelope"></i>
          <a href="mailto:Info@BoulderPotteryLab.org?subject=Request for Information from Boulder Pottery Lab Website" style="color:#B8D05F">Info@BoulderPotteryLab.org</a>
    </li>
    <li> </li>                       <-  extra <li></li> pair
    <li>
        <i class="fa fa-clock-o"></i> Open Lab Hours
    </li>
    <li> </li>                       <-  extra <li></li> pair
    <li> </li>                       <-  extra <li></li> pair
    <li>
     <i class="fa fa-map-marker"></i> Map|Parking
    </li>
</ul>

Hope that helps…

2) It was more of a suggestion. The situation I have is a square image logo that does not have the name of the business in it (this is not that uncommon). It would be nice to be able to put the name of the business in the Title field and display it and optionally the Tagline just to the right of the logo. It would be good to do it this way so the text can be scaled/repositioned in responsive modes or removed altogether (“display:none”) like a Tagline in mobile.

I can add this in the functions php…not a problem for me (a programmer), but it seems like it would be a common situation to need to combine a simple logo with some text in the header. I’ve got a couple of other design work-arounds that I’m also suggesting to my client…

Thanks again!
Ron

[Jason Bobich]

Aw, yeah I see now. I’ll figure out why that’s happening with the header text.

[Author]

Replies