How to create a navbar with different links for each language in ruby on rails

30 views Asked by At

I am trying to create a navbar for English and another one for Spanish. I would like to click on English and display english links and the same for Spanish. So I would like to know a good approach to do it. The navbar works well as I followed the ruby on rails internationalization guides. I am beginning to do it, so I would like some insigth. The navbar looks like this enter image description here

The routes are the following

  # config/routes.rb

scope "(:locale)", locale: /en|nl/ do
  resources :home, :about
end

get '/:locale' => 'home#index'

  root 'home#index'
  #get 'home/index'
  get 'home/about'
  get 'home/acerca'
  
  # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html

  # Defines the root path route ("/")
  # root "articles#index"
end

the navbar is this

<nav class="navbar navbar-expand-lg bg-primary " data-bs-theme="dark"> <!-- dark-->
  <div class="container-fluid">
   <!-- <a class="navbar-brand" href="#">Estrutecnia</a> -->
 <a class="navbar-brand" href="#">
       <!-- <img src="/assets/images/logo.png" alt="Estrutecnia" width="3" height="2">  -->
       <%= image_tag('bootstrap-logo.svg', class: "navbar-logo", alt: "Logo")  %>
       <%= stylesheet_link_tag "logo" %>
    </a> 



    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav me-auto mb-2 mb-lg-0 ms-auto"> <!-- this f ms-auto makes home link dropdown to the very right-->
        
          <a class="nav-link active" aria-current="page" href="/home/acerca">Acerca</a>
        </li>
        <li class="nav-item">
          <a class="nav-link active" aria-current="page" href="#">Español</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#">English</a>
        </li>
        <li class="nav-item dropdown">
          <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
            Mas
          </a>
          <ul class="dropdown-menu">
            <li><a class="dropdown-item" href="#">Construcción</a></li>
            <li><a class="dropdown-item" href="#">Consultoría</a></li>
            <li><hr class="dropdown-divider"></li>
            <li><a class="dropdown-item" href="#">Experiencia</a></li>
          </ul>
        </li>
        <li class="nav-item">
          <a class="nav-link disabled">Disable</a>
        </li>
      </ul>
      <form class="d-flex" role="search">
        <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
        <button class="btn btn-outline-success" type="submit">Search</button>
      </form>
    </div>
  </div>

</nav>

The application_controller

class ApplicationController < ActionController::Base
 around_action :switch_locale

  def switch_locale(&action)
    locale = params[:locale] || I18n.default_locale
    I18n.with_locale(locale, &action)
  end
end

# app/controllers/application_controller.rb
def default_url_options      #put them again jun7
 { locale: I18n.locale }    #put them again jun7
end                       #put them again jun7

the home controller is the following

class HomeController < ApplicationController
  
  def index
    flash[:notice] = "Hello Flash"
   end

  def about #this is about method
    @about_me = "Enhancing"
    @answer = 2023-2017 
  end

 # def acerca #this is acerca method
  #  @about_me = "Somos "
  # end
  def show
    # @article = Article.find(params[:article_id])
    #@comment = @article.comments.find(params[:id])
    #@comment.destroy
    #redirect_to article_path(@article)
  end
end
0

There are 0 answers