How to add some image on the right side of header?

Hello @eorsavik,

Yes. You can use a shortcode on the “Content After Header” option. Also, you can enable and add social icons from Customizer > Header >
Social Menu.

If you want to use a custom shortcode, you can create a custom template from WP Dashboard > OceanWP > My Library. Or create a completely customized header template. For more information about the custom header, please follow this link: https://docs.oceanwp.org/article/355-how-to-create-a-custom-header.

Best Regards

Thanks for sharing the details !!
In fact I don’t want to create a completely customized header template, rather use the existing one and just want to draw an icon/image on the right side of the header. (May be using “Content After Header” option).

Is there any exiting shortcode to achieve that ? If yes how to use it ?
If not available how to create shortcode to achieve that? Any documentation available ?

Thanks again !!

Hello @eorsavik,

You do not need to create a completely customized header.

As I mentioned, to create a custom shortcode(https://postimg.cc/2LDWh9k9), you need to create a template from WP Dashboard > OceanWP > My Library.
Then, you can use that template as a shortcode anywhere you want.
Here is the screenshot: https://postimg.cc/xJrn1W57.

I hope it helps.

Best Regards

Hello @skalanter
I am using the default header template. Since the site is live, I need to create exactly similar template header with some icon at the right, so that site appearance done not change from the original.

Other than that, is there any way to modify the default template that I am already using? My by using some code/hook or whatever.

I am still not sure about the use of ‘Content After Header’ option. I can see when I add string content here they are displayed on the right side of the header. Instead of string content, can I use some link to image/icon and get it displayed.

Thank you so much for your time.
Best Regards.

Hello @eorsavik,

Here are the hooks we have in the theme, so you can find where you want to show your desired shortcode https://docs.oceanwp.org/category/376-hooks.

For example, here is after the logo inner: “ocean_after_logo_inner”.

Otherwise, you can customize the theme, so the solution to achieve it is customization, and it needs familiarity with PHP, if you are unfamiliar with PHP, you can contact a PHP expert. To do this, first, you need to use the child theme. You can copy the metafile from the partials folder in the child theme following the same path and then make the necessary changes.

For more information about that, please follow the steps below:

By using FTP or cPanel access (if didn’t use the localhost), Go to this directory:
wp-content\themes\oceanwp\partials
Find your template which you want to customize and copy that template file(in your case, for example, you need to change the date on the blog page, so you need to use the blog template(s): https://i.postimg.cc/brv9gn9s/image.png).

Then head over to the same path on the child theme. There isn’t an entry folder as a default on your child theme, so you need to create a new one(one time).

Example: If you want to change the HTML tags structure in the single blog post featured image for standard post format, all you need in this step is the following:

1. Head over to your WP root > wp-content > themes > oceanwp > partials> single > media path.
2. Then, find the “blog-single.php” file and copy this file.
3. After that, go back to the themes folder (wp root > wp-content > themes) and go to the oceanwp-child-theme-master folder.
4. Create a new folder with the “partials” name in the child theme.
5. Go to the /partials/ folder and create a new folder with the “single” name.
6. Go to the /single/ folder and create a new folder with the “media” name.
7. Go to the /media/ folder and paste the “blog-single.php” file here.

* Please check this screenshot: https://i.postimg.cc/sxjYTWyt/image.png.
* Download child theme: https://docs.oceanwp.org/article/90-sample-child-theme.
* Developer docs: https://docs.oceanwp.org/collection/19-developer-doc.

Note: It’s working with the /woocommerce/ folder or root of the theme files.

I hope it helps.
Best Regards

Hey,
Thank you very much for the details. Much appreciated.
This is bit of work I need to try myself, hope this will help.
Best Regards !!!