Hello,
Please see attached screen shot (its from the new JoomlArt Uber 2.1.0 template (music style and then choose Events).
In the screenshot, I want my 'Date' to look the same...IE: 'd' in a larger font on one line, and then on the line below the 'M' and 'Y' are written in a smaller font.
In other words, how do I split the 'd' to be on one line, and then the 'M' and 'Y' below it on the 2nd line (as per the screen shot).
Thanks
http://www.inspire.im/date-time-format-display.jpg
Hi Austenn01,
I think this can be solved with a class added and then in the css you can use first-word for a different font and a clear:both to force a new line. Hope this puts you on the right track.
Regards
Hello,
Thanks for the reply, but there is no CSS pseudo that use 'first word'
http://www.w3schools.com/css/css_pseudo_elements.asp
Any other ideas?
EDIT:
This apparently can be done with jquery:
http://stackoverflow.com/questions/3760085/first-word-in-string-with-jquery
Could someone give me some help with how to set this up in Seblod (Where do i add the jquery code...do I just copy and paste the code used on that site? etc etc)?
Thanks
Hi austenn01,
You don't need to use javascript to implement this feature.
Can you tell us the html structure you want to have. After that, i can say you how you can to obtain it.
Regards,
Mehdi
Hello, as per OP you can view it by going to JoomlArt and viewing their demo of the Uber template (then choose the 'Music' site design...and then choose the 'Events' menu from there).
Here is the html markup:
<span class="blog-date">
Hi,
For that, you should create 2 copies of the field "Article Created".
To create a copy of a field, you should have the same storage settings. For our case, the storage settings are : standard, article, created.
- On the first copy, you should apply the "date" typography plugin with the following configuration: "format" = free and "free format" = d
- On the second copy, you should apply the "date" typography plugin with the following configuration: "format" = free and "free format" = M Y
- You should apply the "html" typography plugin on the "Article Created" field, click on + and fill the following code
<span class="date">$cck->getTypo('field_name_of_copy1');</span>
<span class="month-year">$cck->getTypo('field_name_of_copy2');</span>
</span>
Regards,
Mehdi
Hello Mehdi,
would be nice to have something like this as a build-in feature. I mean as an optional format in Date typography...
Maybe it is possible to enter/filter markup in the free format!?
Maybe it makes even sense to have always default SPAN tags on each part.
Or better a separate, special Date Typo?
Hello,
Thanks for your help.
The date is now showing as required, but since you asked to create 2 more date fileds )as per above), both these date fields are showing BELOW my required date field.
How do i hide the 2 copies of my original date field (since we set the typo to be 'date', i cant choose 'clear' to make nothing show).
Please advise.
Here is a screen shot:
http://www.inspire.im/seblod-events-date-twice.jpg
Hello austenn01,
you might use other options to get rid of them:
- by CSS. Set a field's MarkUp Class with #3. "hidden" should work as far as Bootstrap is used. Or create your own CSS.
- move the fields to the Position "Hidden". This will create a surrounding extra DIV, which is also hidden by inline CSS.
- The Seb Blog template also offers a Position "Clear" in Item View. It seems to remove the whole output and generated markup. Not sure if this has an impact on using the field values in your other HTML typo? Please, try it for yourself.
Hope this helps. Good luck.!