使用Devise / Oauth将配置文件图片添加到Bootstrap / Foundation Navbar?

时间:2013-10-07 15:19:38

标签: twitter-bootstrap devise oauth-2.0 ruby-on-rails-4 zurb-foundation

我一直在网上研究,并没有找到一个关于在使用Oauth / Devise / Bootstrap或Foundation时向导航栏添加个人资料图片的指南 - 任何建议/指南?谢谢。

1 个答案:

答案 0 :(得分:0)

没有太多信息可以从这里开始......

此档案图片存储在哪里?你是从用户的Oauth帐户中抓取它的吗?从Facebook或Twitter说?或者你自己存放?

我会假设您只是在用户登录后尝试使用本地存储的个人资料图片更新导航栏(这是正确的吗?)。

Bootstrap和Foundation只是JS和CSS库,它们会影响你的显示,但通常不需要显示你的个人资料图片。

如果您正在使用Ruby on Rails和Devise,那么您已经有一个名为'current_user'的帮助方法,Devise免费提供。

如果您想在用户登录后在导航栏中显示个人资料照片,那么您只需使用...

<nav id='nav_bar'>
  <% if current_user %>
   <%= image_tag("/assets/yourimagename.jpg", class: "foundation_or_bootstrap_class") %>
  <% end %>
  <ul class='nav_links'>
    <li><%= link_to 'Sign In', '#yourlinkhere', class: 'sign_link' %></li>
    <li><%= link_to 'Sign Out', '#yourlinkhere', class: 'sign_link' %></li>
  </ul>
</nav>

在这种情况下,导航栏只会在页面重新加载或重定向时更新。如果你想用javascript更新导航栏,你也可以这样做,但需要更详细的编码。

如果您只是使用首次提供的Devise gem,则无法直接访问Devise视图或控制器,因此上面的代码将位于上面的views / layouts / application.html.erb中。

然后,在任何视图甚至设计视图中,配置文件pic都将出现在导航栏中。

如果您想影响设计视图和控制器,有一种方法可以解决这些问题。 Devise Wiki提供了有关此过程的详细信息......

https://github.com/plataformatec/devise#getting-started

<配置视图'和'配置控制器'下的

如果您添加一些示例和更多信息,我可以进一步详细说明并提供更多代码。也许这已经有所帮助?