How to implement more than one top page in Rails breadcrumb trail

Good evening Aloha man, Yasunori!

Today, I would like to explain ** "How to implement two or more types of top pages" **, which I stumbled upon when introducing the breadcrumb trail Gemgretel used in my portfolio!

If anyone wants to implement the same thing as me, please refer to it! !!

Conclusion

When implementing two or more types of top pages,

config/breadcrumbs.rb


crumb :root do
  link "Home", root_path
end

Initial setting

config/breadcrumbs.rb


crumb :top_page do
  link "top page", root_path
end

crumb :mypage_top do |user|
  link "My page top", user_path(user.id)
end

Correct the description like this and eliminate the setting of root! !!

Why do you need more than one top page?

First of all, why do I usually need two or more types of top pages that only need one? This is because my portfolio was "looked better".

... there is no theoretical explanation for this

For example, when transitioning to the search result page or detail page in the portfolio, of course, the transition history from the top page is displayed. Image from Gyazo

However, the transition history when transitioning to the user information edit page in My Page is Image from Gyazo As you can see, there is no link to the top page, only a link to the top page of my page.

If this makes the transition history also display the top page, Image from Gyazo I thought that it would be a little difficult to see because there were many displays.

How to prepare two types of top pages?

When using gretel, basically describe only the transition destination link and display character string, and if you want to set the parent page, describe the setting separately.

config/breadcrumbs.rb


crumb :root do
  link "top page", root_path
end

crumb :mypage_top do |user|
  link 'My page top', user_path(user.id)
end

crumb :mypage_edit do |user|
  link 'Confirmation / change of member information', edit_user_registration_path
  #The user information edit page is set to be located at the top of My Page.
  parent :mypage_top, user
end

However, even if nothing is set, it will be linked to the root setting. Therefore, the top page that is linked when displaying the transition history up to the user information edit page is displayed.

"Then, just change the name to break the link with root! !! 』
So that's where the code I showed you at the beginning comes into play.

config/breadcrumbs.rb


crumb :top_page do
  link "top page", root_path
end

crumb :mypage_top do |user|
  link "My page top", user_path(user.id)
end

crumb :mypage_edit do |user|
  link 'Confirmation / change of member information', edit_user_registration_path
  #The user information edit page is set to be located at the top of My Page.
  parent :mypage_top, user
end

It becomes the code structure. By displaying the user information edit page again with this code structure, the display of the top page that is not linked disappears and the transition history from the my page top is displayed.

important point

There is one thing to keep in mind when using this implementation method.

That is, ** "You need to set the parent page for the search result page "**.

config/breadcrumbs.rb


crumb :root do
  link "top page", root_path
end

crumb :search_word do |search_word|
  link "'#{search_word}'Search results", search_path
end

Originally, it was linked to root without setting anything on the search result page, so it automatically displayed the top page, but it was renamed (in this case, Since it has been changed to top_page), the association is released and the parent page does not exist.

So

config/breadcrumbs.rb


crumb :top_page do
  link "top page", root_path
end

crumb :search_word do |search_word|
  link "'#{search_word}'Search results", search_path
  #Newly set top_Set a page called page as the parent page.
  parent :top_page
end

You can restore the original breadcrumb trail by modifying the code.

Finally

I don't think implementing more than one type of top page is that frequent, but I hope you find this article helpful when implementing it!

We would love to hear your suggestions and advice on this matter, so we welcome your comments! !!

Recommended Posts

How to implement more than one top page in Rails breadcrumb trail
How to implement search functionality in Rails
How to implement ranking functionality in Rails
How to implement a slideshow using slick in Rails (one by one & multiple by one)
How to implement a like feature in Rails
How to implement a like feature in Ajax in Rails
[Rails] How to implement scraping
How to implement infinite scrolling (page nate) in Swift TableView
[Rails] How to write in Japanese
How to introduce jQuery in Rails 6
[Rails] How to implement star rating
How to install Swiper in Rails
How to implement date calculation in Java
How to implement Kalman filter in Java
How to use custom helpers in rails
How to insert a video in Rails
How to use MySQL in Rails tutorial
How to implement coding conventions in Java
[rails] How to configure routing in resources
How to implement image posting using rails
How to implement asynchronous processing in Outsystems
How to use credentials.yml.enc introduced in Rails 5.2
How to implement gem "summer note" in wysiwyg editor in Ruby on Rails
[Rails] Button to return to the top of the page
How to display a web page in Java
[Rails] How to use select boxes in Ransack
[Rails] Show multi-level categories in the breadcrumb trail
How to translate Rails into Japanese in general
How to prevent direct URL typing in Rails
[Rails] How to implement unit tests for models
How to implement the breadcrumb function using gretel
How to implement image posting function using Active Storage in Ruby on Rails
How to separate .scss by controller in Rails
How to conditionally add html.erb class in Rails
One way to redirect_to with parameters in rails
How to easily create a pull-down in Rails
How to use JQuery in js.erb of Rails6
[Rails] How to easily implement numbers with pull-down
How to implement optimistic locking in REST API
[Ruby on Rails] How to install Bootstrap in Rails
How to make a follow function in Rails
[Rails] How to use PostgreSQL in Vagrant environment
How to check Rails commands in the terminal
How to implement Pagination in GraphQL (for ruby)
[rails devise] How to transition users who are not logged in to the login page
How to implement a circular profile image in Rails using CarrierWave and R Magick
How to implement UICollectionView in Swift with code only
How to implement login request processing (Rails / for beginners)
How to set the display time to Japan time in Rails
[Ruby on Rails] How to write enum in Japanese
Pointcut Expression I want to specify more than one
[Rails, JS] How to implement asynchronous display of comments
Introduce devise in Rails to implement user management functionality
How to make an almost static page with rails
[Ruby On Rails] How to reset DB in Heroku
[How to insert a video in haml with Rails]
How to write a date comparison search in Rails
How to query Array in jsonb with Rails + postgres
[Rails 6] How to set a background image in Rails [CSS]
Summary of how to implement default arguments in Java
Rails learning How to implement search function using ActiveModel