Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

External link in the menu #350

Closed
Compizfox opened this issue May 29, 2022 · 3 comments
Closed

External link in the menu #350

Compizfox opened this issue May 29, 2022 · 3 comments
Labels

Comments

@Compizfox
Copy link

How do I add a menu item to the menu that is a link to an external website as opposed to an internal page? As far as I understand, the menu only sources its content from the pages' front matter.

Sorry in advance if this is a stupid question, Jekyll noob here ;)

@sylhare
Copy link
Owner

sylhare commented May 30, 2022

The links in the navigation bar are added automatically based on the pages in the pages folder (with search, tags, portfolio ...).

So you can't just plug an external link there by default. (We could customize the navbar.liquid to display some websites from the config.yml, something that I might look into in the future).

However, If you wish to add a link to an external page, there's a workaround, where you can add a new page which will redirect on load to the external one. For example, adding this github.md in the pages folder, I am able to go to the GitHub repository when clicking on the title in the navbar.

---
layout: page
title: GitHub
permalink: /redirect/
---

### Redirecting to the GitHub page ...

<script type="text/javascript">
    window.location.href = "https://github.com/sylhare/Type-on-Strap"
</script>

@Compizfox
Copy link
Author

Thanks, I see.

I already came across the JS redirect method, but it's a hacky workaround imo. I'd really like to have a proper, direct link in the menu.

I'll look into modifying navbar.liquid!

@Compizfox
Copy link
Author

For now, I just added this in navbar.liquid, before the existing loop:

        {% for item in site.data.menu %}
            <li class="separator"> | </li>
            <li>
                <a class="clear" aria-label="{{ item.title }}" title="{{ item.title }}" href="{{ item.url}}">
                    {% if item.icon %} <i class="fas {{ item.icon }}" aria-hidden="true"></i>
                    {% else %} {{ item.title }} {% endif%}
                </a>
            </li>
        {% endfor %}

And create a file _data/menu.yml containing a list of menu items (with title and url).

This isn't perfect, as it constrains your external links to be in front (or after) the internal ones, but it's a start.

Repository owner locked and limited conversation to collaborators Jun 9, 2022
@sylhare sylhare converted this issue into discussion #352 Jun 9, 2022

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
Projects
None yet
Development

No branches or pull requests

2 participants