莆田公司网站设计:如何将标志添加到额外的辅助菜单中

2019.04.29 |
标签

不久前,我创造并放弃了我们的第一个免费额外类别布局包。反应很好,所以我已经开始了我的下一个工作:一个视频博客的额外类别布局。在创建它的过程中,莆田公司网站设计意识到我在演示站点上做的事情可能是社区也想知道如何去做的事情。如何将徽标添加到Ex外的辅助菜单(并将主菜单隐藏在一起)。

概念与启示

莆田公司网站设计

当我寻找有趣的视频网站时,我得到了灵感。我真的很喜欢Hulu网站在页面顶部有一个非常低调的、最小的菜单,然后让访问者直接进入他们的内容-这也是每个人都想要的!

我很快意识到,只要稍微修修补补,我就可以在“额外”上有一个非常相似的表情。这是怎么回事!

准备设计元素

莆田公司网站设计在本教程中,您可能需要更小版本的徽标。我在我的例子中使用的维度是190 px和25 px。你甚至可以选择变小,这取决于你的标志和它在不同的尺度上的外观。

一旦你创建了这个版本的你的标志,你会想要上传到你的网站,以便你有方便的访问它以后。

如何将标志添加到额外的辅助菜单中

你要做的第一件事就是隐藏你的主菜单。在WordPress管理员中导航到divi>主题选项然后向下滚动常规选项卡,直到您到达自定义CSS面板。

复制并粘贴以下CSS:

#main-header {
display: none;
}

#main-header-wrapper {
display: none;
}

点击绿色的“保存更改”按钮,刷新网站的前端。如果您的所有其他设置仍然设置为默认设置,则标题现在可能会如下所示。

莆田公司网站设计

接下来,去主题定制>标题&导航设置>标题元素设置并取消“显示趋势栏”旁边的方框。在退出主题定制程序之前,单击蓝色的“保存和发布”按钮。

现在是创建实际菜单的时候了,方法是外观>菜单。要开始,单击蓝色链接文本“创建一个新菜单”。

将菜单命名任何您想要的,并确保勾选复选框在屏幕底部的“菜单设置”下,使该菜单将显示为辅助菜单。

现在,您可以在菜单中填充要显示的所有链接。在我的例子中,我添加了我的所有类别。

最后,添加一个自定义链接。

在URL字段中,只需将网站的主页域放置。毕竟,这将成为你的“家”按钮。然后,在导航标签字段中放置下一行HTML。

<span><img src="YOUR LOGO IMAGE LINK"></span>

将文本“您的徽标图像链接”替换为指向媒体库中的徽标图像文件的链接。如果您不知道如何获得该链接,请访问媒体>图书馆然后点击你的标志图像。

logo-image-link

当附件详细信息模式弹出时,您将在URL字段中看到URL。复制它并将其粘贴到上面HTML代码中指定的空格中。

当您的自定义链接完成后,保存您的菜单和刷新您的网站的前端。你现在应该有一个苗条,最小的标题与您的标志放置在额外的第二菜单。

extra-secondary-menu-logo-final

你还对什么额外的教程感兴趣?

莆田公司网站设计知道在我们的社区里有很多热情的额外用户,有各种各样的额外的教程和免费的请求。这是你的机会来问,并让他们加入我们的内容生产队列!让我们知道在下面的评论,你希望我们在未来的报道,我会很高兴把它写下来,然后写在一个未来的帖子。


相关推荐

最新文章

热门推荐

联系电话 400-6065-301

微信咨询 寒总监