CSS and Boxes

Post

Posted
Rating:
#8981 (In Topic #3047)
Avatar
Standard member
Master Rat is in the usergroup ‘Well-settled’

I want to change the box look for just one catalog.

For those that can clear my mind...

I have a catalogue made and I have the templates set to that specific catalog.

IE
  • templates/CATALOGUE_poetry_CATEGORY_EMBED.tpl (1)
  • templates/CATALOGUE_poetry_CATEGORY_SCREEN.tpl (1)
My question is simple...

I understand that Global.css controls all the box layouts however I do not want to change ALL the boxes for the whole site when I only need the catalog to have the changes shown. Do I need to attach a separate CSS file to the template or do I inline the changes in the template itself or do I need to add new names to the boxes and change the template to the naming? Seems to me that is an elongated process that should be simple...

Any help would be appreciated.

Brat Rat
 
Online now: No Back to the top

Post

Posted
Rating:
#8982
Avatar
Site staff
Adam Edington is in the usergroup ‘Super-moderators’
As these are custom catalogue templates and the changes are minimal, doing the CSS overrides inline seems the simplest thing to do.
Online now: No Back to the top

Post

Posted
Rating:
Item has a rating of 5 (Liked by Chris GrahamLiked by Master RatLiked by Adam Edington)
#8992
Avatar
Standard member
SoccerDad is in the usergroup ‘Community saint’
Building on what Adam has mentioned, the easiest way I've found for customizing specific boxes for catalogues is to simply add a class or id name at the top of the template thereby allowing customization for every element in the template.

Here's an example from a catalogue I've entitled "spotlight". Note the addition of the div tag right after the START directive with a class of spotlight.

In my global.css, here is an example style:

Code

.spotlight box {
    border: 0;
}

.spotlight box a {
    color: #FFFFFF;
}

Code

{TITLE}

{+START,IF_NON_EMPTY,{DESCRIPTION}}
   <div class="spotlight"><div class="box box___catalogue_default_category_screen__description"><div class="box_inner">
      <div itemprop="description">
         {$PARAGRAPH,{DESCRIPTION}}
      </div>
   </div></div>
   </div>
{+END}

{$SET,bound_catalogue_entry,{$CATALOGUE_ENTRY_FOR,catalogue_category,{ID}}}
{+START,IF_NON_EMPTY,{$GET,bound_catalogue_entry}}
   {$CATALOGUE_ENTRY_ALL_FIELD_VALUES,{$GET,bound_catalogue_entry}}

   <hr class="spaced_rule" />
{+END}

{+START,IF_NON_EMPTY,{SUBCATEGORIES}}
   <div class="spotlight"><div class="box box___catalogue_category_screen"><div class="box_inner compacted_subbox_stream">
      <h2 class="hide">{!SUBCATEGORIES_HERE}</h2>

      <div>
         {SUBCATEGORIES}
      </div>
   </div></div>
   </div>
{+END}

{ENTRIES}

{$REVIEW_STATUS,catalogue_category,{ID}}

{+START,IF,{$CONFIG_OPTION,show_content_tagging}}{TAGS}{+END}

{+START,INCLUDE,NOTIFICATION_BUTTONS}
   NOTIFICATIONS_TYPE=catalogue_entry__{CATALOGUE}
   NOTIFICATIONS_ID={ID}
   BREAK=1
   RIGHT=1
{+END}

{$,Load up the staff actions template to display staff actions uniformly (we relay our parameters to it)...}
{+START,INCLUDE,STAFF_ACTIONS}
   1_URL={ADD_ENTRY_URL*}
   1_TITLE={!do_next:NEXT_ITEM_add_one}
   1_REL=add
   1_ICON=menu/_generic_admin/add_one
   2_URL={ADD_CAT_URL*}
   2_TITLE={!do_next:NEXT_ITEM_add_one_category}
   2_REL=add
   2_ICON=menu/_generic_admin/add_one_category
   3_ACCESSKEY=q
   3_URL={EDIT_CAT_URL*}
   3_TITLE={!do_next:NEXT_ITEM_edit_this_category}
   3_REL=edit
   3_ICON=menu/_generic_admin/edit_this_category
   4_URL={EDIT_CATALOGUE_URL*}
   4_TITLE={!EDIT_CATALOGUE}
   4_ICON=menu/cms/catalogues/edit_this_catalogue
{+END}

{+START,IF,{$CONFIG_OPTION,show_screen_actions}}{$BLOCK,failsafe=1,block=main_screen_actions,title={$METADATA,title}}{+END}

{$,Display top/recent entries. By default it is only shown on the A-Z screen, which has a blank ID}
{+START,IF_NON_EMPTY,{SUBCATEGORIES}}{+START,IF,{$EQ,{ID},}}
   <hr class="spaced_rule" />

   <div class="boxless_space">
      {+START,BOX}{$BLOCK-,block=main_multi_content,param=catalogue_entry,filter={$?,{$IS_NON_EMPTY,{ID}},{ID}*},no_links=1,efficient=0,give_context=0,include_breadcrumbs=1,render_if_empty=1,max=10,mode=recent,title={!RECENT,10,{!ENTRIES}}}{+END}

      {+START,IF,{$CONFIG_OPTION,is_on_rating}}
         {+START,BOX}{$BLOCK-,block=main_multi_content,param=catalogue_entry,filter={$?,{$IS_NON_EMPTY,{ID}},{ID}*},no_links=1,efficient=0,give_context=0,include_breadcrumbs=1,render_if_empty=1,max=10,mode=top,title={!TOP,10,{!ENTRIES}}}{+END}
      {+END}
   </div>
{+END}{+END}


Hope this helps!


"no violence, no hate, no pain, no enemies
just peace, unity, tolerance and love" - The Beloved
Online now: No Back to the top

Post

Posted
Rating:
Item has a rating of 5 (Liked by SoccerDad)
#9000
Avatar
Standard member
Master Rat is in the usergroup ‘Well-settled’
Thank you, it actually helped a lot
Online now: No Back to the top
1 guest and 0 members have just viewed this.
Back to Top