Community Forums › Forums › Archived Forums › Design Tips and Tricks › Code for Today's Date
Tagged: today's date
- This topic has 11 replies, 2 voices, and was last updated 10 years, 8 months ago by
BP.
-
AuthorPosts
-
May 17, 2014 at 11:53 am #105636
BP
MemberDoes anyone have the code to add "today's date" in the Header Right widget area in the Prose theme?
Brad
May 17, 2014 at 3:05 pm #105657nutsandbolts
MemberFirst, add the following to your custom functions (this allows you to use shortcodes in widget areas and sidebars):
// Enable shortcodes in widgets add_filter('widget_text', 'do_shortcode');
After that, add the following (also in custom functions) to create a shortcode that will display the date - props to @srikat:
// Add today's date shortcode add_shortcode('todays_date', 'get_todays_date'); function get_todays_date($atts) { // return date('F j, Y'); return date_i18n( get_option( 'date_format' ) ); }
Then you can use
[todays_date]
in the Header Right widget area to display the shortcode.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+May 18, 2014 at 8:14 am #105726BP
MemberThank you! NutsandBolts. That's cool.
Can you please tell me how to align the date right and change its color.
Brad
May 18, 2014 at 8:18 am #105727nutsandbolts
MemberCan you post a link to your site? It's always easier to help if we can see what you see.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+May 18, 2014 at 8:21 am #105728BP
MemberMay 18, 2014 at 8:28 am #105730nutsandbolts
MemberIs the date on there right now? If it is, I can't see it.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+May 18, 2014 at 8:43 am #105734BP
MemberNo. I remove it because it didn't look good.
Brad
May 18, 2014 at 9:08 am #105737BP
MemberMay 18, 2014 at 9:15 am #105741nutsandbolts
MemberOkay, here's what worked for me on a test site.
In your text widget, assign a div class to the shortcode like this:
<div class="thedate">[todays_date]</div>
Then in your stylesheet, you can do this:
.thedate { color: #fff; float: right; }
See if that works for you and let me know. 🙂
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+May 18, 2014 at 9:27 am #105743BP
MemberWorks! But creates white space between header and nav bar in small mobile devices when testing here: http://www.studiopress.com/responsive/ Do you know how to prevent that?
Brad
May 18, 2014 at 9:38 am #105746nutsandbolts
MemberHmm... Try giving .thedate a background color just like the header and see if that gets it. I think we'll probably have to do a little more than that, though, so if that doesn't work...
(1) Assign a background color to
#header .widget-area
(2) On your 960px media query, change the padding on the header from this:
@media only screen and (max-width: 960px) #header { padding: 10px 0; }
to this:
@media only screen and (max-width: 960px) #header { padding: 15px 0; }
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+May 18, 2014 at 10:37 am #105752BP
MemberI really appreciate all your help, but this is getting too complicated. The date is not all that important, so I'm just going to put it in another widget (which your code enabled) or use the one that's available in the primary nav extras (and use Genesis Prose Extras plugin to switch their locations.)
Thank you for your time and efforts.
Brad
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.