Categories and Tags returning 404 on the sidebar when using ugly permalinks

Question

I am using "ugly" permalinks and they are fine in index.php and single.php. I also have a template called sidebar.php that builds a sidebar when at the article/post level. When clicking categories and tags on the sidebar I am then returned with a 404. The actual format is:

http://localhost/mywebsite/tag/mytag

http://localhost/mywebsite/category/mycategory

As opposed to what I am expecting for ugly permalinks (and it shows in index.php and single.php):

http://localhost/mywebsite/?tag=1

http://localhost/mywebsite/?cat=3

My tags are defined like this:

function printTags($tags){
    if ($tags!=false) {
      $return = '';
      foreach ($tags as $i){
        $return .= '<li><a href="' . home_url() . "/tag/" . $i->slug . '">' . $i->name . '</a></li>';
      }
      return $return;
    }
}




function getTags($tagData){
    $tagArray = [];
    if($tagData!=false){
      foreach ($tagData as $i){
        array_push($tagArray, $i->name);
      }
    }
    return $tagArray;
}

My HTML/PHP is as follows:

function newSuggestion($itemTitle, $sectionSlug, $section, $image, $url, $tags){
    echo "<li class='row class'>
            <div class='col item'>
              <div class='row img-container'>
                <div class='col'>
                  <a href='{$url}'><img src='{$image}' alt='No Image'/></a>
                </div>
              </div>
              <div class='row anotherclass'>
                <div class='categories-container'>
                  <strong><a href='". home_url() ."/category/". $sectionSlug."'>{$section}</a></strong>
                </div>
                <div class='tags-container'>
                  <ul class='tags'>". printTags($tags) ."</ul>
                </div>
              </div>
              <div class='row title-container'>
                <h2 class='h3'><a href='{$url}'>{$itemTitle}</a></h2>
              </div>
            </div>
          </li>";
}

Where am I going wrong?

Thank you

EDIT1:

Here is my getPosts function from sidebar.php:

    function getPosts($posts, $numSuggestion){

      foreach ( $posts as $post ) {
         if ($post->ID!=get_the_ID() &&  $GLOBALS['currentSuggestion']<$numSuggestion && !in_array($post->ID, $GLOBALS['$alreadySuggested'])){
            $imageUrl = wp_get_attachment_url( get_post_thumbnail_id($post->ID));

            if ($imageUrl == false){
              $imageUrl = getDefaultImage();
            }
            newSuggestion($post->post_title, get_the_category($post->ID)[0]->slug, get_the_category($post->ID)[0]->name, $imageUrl, get_permalink($post->ID), get_the_tags($post->ID));
            $GLOBALS['currentSuggestion']++;
            array_push($GLOBALS['$alreadySuggested'], $post->ID);
          }
      }
    }

EDIT2:

I have attempted this:

<div class='categories-container'>
                  <strong><a href='". home_url() ."/category/?cat=". $cat_ID."'>{$section}</a></strong>
                </div>

But with no success, is that the right direction. Where do I make the modification in order to get the categories URL in the format "home_url/category/?cat=123"?

EDIT3:

Not sure I am going towards the right direction, but I have managed to get the right URL, however it returns a 404 (as opposed to categories at article/home level)

I have modified the getPosts function so that get_the_category is mapped to the cat_ID rather than the slug (I am not sure that is the right approach):

 newSuggestion($post->post_title, get_the_category($post->ID)[0]->cat_ID, get_the_category($post->ID)[0]->name, $imageUrl,

then my newSuggestion function has:

  <div class='categories-container'>
                  <strong><a href='". home_url() ."/category/?cat=". $sectionSlug."'>{$section}</a></strong>
                </div>

Any idea why I am still hitting a 404, while the same URL is functioning in other parts of the site (e.g. home/index or article)?

EDIT4:

I finally got the categories working with this:

<div class='categories-container'>
                  <strong><a href='". get_term_link( $sectionSlug) . "'>{$section}</a></strong>
                </div>

Answer 1

Instead of:

home_url() . "/tag/" . $i->slug

Use get_term_link() function. It will return the link for the term according with the current configuration:

// Assuming $i is a term object
get_term_link( $i->term_id )

For example, your printTags() function would be:

function printTags($tags){
    //Check to see if tags are provided
    if ($tags!=false) {
      $return = '';
      foreach ($tags as $i){
        $return .= '<li><a href="' . get_term_link( $i->term_id ) . '">' . $i->name . '</a></li>';
      }
      return $return;
    }
}

Answer 2

Following the suggestion for tags, I have gotten categories working.

I have modified the getposts function by mapping the category to the cat_ID, rather than the slug:

newSuggestion($post->post_title, get_the_category($post->ID)[0]->cat_ID, get_the_category($post->ID)[0]->name, $imageUrl,

Then the NewSuggestion functions works out the categories in this way:

<div class='categories-container'>
                  <strong><a href='". get_term_link( $sectionSlug) . "'>{$section}</a></strong>
                </div>

The approach works, any suggestion or recommendation on how to improve it is more than welcome.