search

adamjgrant / kickstart

Kickstart is a CSS library designed for modularity and fast page performance
http://getkickstart.com
1.87k stars 94 forks source link

Breadcrumbs on kickstrap #90

Closed ganar closed 10 years ago

ganar commented 10 years ago

Given the number of technologies in Kickstrap it's hard to decide which would be the best way to include a dynamic breadcrumb in a page.

Can you give me any advice on the matter? I'm using kickstrap for IA prototype. I'm a designer (CSS, HTML, some JS but just with basic rudiments of OOP)

adamjgrant commented 10 years ago

Good question. I would highly recommend forgoing dynamic in this case, actually. 

Although it would be great for page performance, it will kill your SEO because google won't see your pages. 

Then again, that might not matter if you're doing this for prototyping. 

Before I can answer, are the items in the breadcrumbs referring to actual, individual html pages or angular views being loaded into ng-view? — Sent from Mailbox for iPhone

On Sat, Feb 22, 2014 at 1:50 PM, ganar notifications@github.com wrote:

Given the number of technologies in Kickstrap it's hard to decide which would be the best way to include a dynamic breadcrumb in a page.

Can you give me any advice on the matter? I'm using kickstrap for IA prototype. I'm a designer (CSS, HTML, some JS but just with basic rudiments of OOP)

Reply to this email directly or view it on GitHub: https://github.com/ajkochanowicz/Kickstrap/issues/90

ganar commented 10 years ago

I'm building the prototype using jade partials pages, for the sake of simplicity. I will be building some elements as angular partials : a gallery, rollovers, things of that nature.

I don't see a way to build a navigation tree, at least not in the _header partial. There is a .coffee file that has information on the pages, but not a tree: all of the pages seem to be at the same level.

adamjgrant commented 10 years ago

So would the items in the breadcrumbs refer to the Jade partials? If so, the code in _header could be copied to do this. It basically works that way. 

If not, I'm still wondering what the dynamic aspect of this is, other than the gallery. Typically angular partials refer to html that is loaded into ng-view.  Is that the case here? — Sent from Mailbox for iPhone

On Sat, Feb 22, 2014 at 2:16 PM, ganar notifications@github.com wrote:

I'm building the prototype using jade partials pages, for the sake of simplicity. I will be building some elements as angular partials : a gallery, rollovers, things of that nature.

I don't see a way to build a navigation tree, at least not in the _header partial. Reaching all of the configuration files in the project is not easy either.

Reply to this email directly or view it on GitHub: https://github.com/ajkochanowicz/Kickstrap/issues/90#issuecomment-35811493

ganar commented 10 years ago

I'm sorry about that: the word dynamic in this case is to avoid having to set the breadcrumb manually in each jade document.

It also means that the breadcrumb should know the location of the page within the tree. For instance

Home > Tree > branch > leaf

I don't see a way to do this with the example pages or videos (I'm not a JS developer, sorry about that)

Setting the breadcrumb as part of the header seems like a good idea

adamjgrant commented 10 years ago

Actually, I think you may want to use jade variables,

So in your layout.jade, you could define

block variables

(and this may already exist in the provided files)

Then, in one of your jade partials define a variable for the pageName

block variables

In layout or elsewhere, you can then insert pageName into the breadcrumbs

I believe this is the right syntax. You may want to google jade variables to find out how exactly to do it for your implementation.

Adam Kochanowicz

2014-02-24 15:43 GMT-05:00 ganar notifications@github.com:

I'm sorry about that: the word dynamic in this case is to avoid having to set the breadcrumb manually in each jade document.

It also means that the breadcrumb should know the location of the page within the tree. For instance

Home > Tree > branch > leave

I don't see a way to do this with the example pages or videos (I'm not a JS developer, sorry about that)

Reply to this email directly or view it on GitHubhttps://github.com/ajkochanowicz/Kickstrap/issues/90#issuecomment-35933690 .

ganar commented 10 years ago

Thanks for the suggestion. I Will try to build some kind of array of arrays to build some kind of three-like structure