Bijay
Bijay

Reputation: 43

How do I change only the home url of logo on a wordpress site with oceanWP theme?

I have a site deployed on say, abc.com which uses angular for homepage and WordPress for the blogs. I have deployed the WordPress website in a subfolder inside abc.com. The file structure is as depicted in the image below.

Now I want to change only the homepage link on the logo of the WordPress website, which on click will redirect us to abc.com. Rest of the blog links will work normally, say 'abc.com/myProj/blog-detail'

File structure image

Upvotes: 2

Views: 5611

Answers (1)

over-engineer
over-engineer

Reputation: 1053

OceanWP uses the the_custom_logo() function to display your custom logo and link to the WordPress site’s home page (example.com/myProj). The file that renders the logo is located at /wp-content/themes/oceanwp/partials/header/logo.php.

You can use the get_custom_logo hook to modify the HTML of the custom logo and change the link to point to the actual home page (example.com).

To do that, you’ll have to create a child theme (or a plugin) and insert the following in your functions.php file:

<?php
/**
 * Modify the logo link
 *
 * @param string $html  Custom logo HTML output
 * @param int $blog_id  ID of the blog to get the custom logo for
 * @return string       Custom logo HTML output with modified link
 */
function oceanwp_child_modify_logo_link( $html, $blog_id ) {
  $custom_logo_id = get_theme_mod( 'custom_logo' );
  $html = sprintf(
    '<a href="%1$s" class="custom-logo-link" rel="home">%2$s</a>',
    esc_url( 'https://example.com/' ),  // modify the link here
    wp_get_attachment_image( $custom_logo_id, 'full', false, $custom_logo_attr )
  );

  return $html;
}

add_filter( 'get_custom_logo', 'oceanwp_child_modify_logo_link', 10, 2 );

If you also need to handle things like the logo alt attribute being empty or the logo not being set, you can refer to the get_custom_logo() function.

(I’ve tested it on WordPress 5.3.2 and OceanWP 1.7.4)

Upvotes: 3

Related Questions