Topbar search and alignment

Support
#1

Hi, I have added a contact form icon into the topbar - the icon (envelope) is aligne left - but would like to have it aligned with the social icons to the right. I would also like to add a search bar in the top bar (have tried to follow the existing threads to do so but not gotten it to work) would really appreciate your help.
Here is the URL to my site: https://delosdr.org

Best, Anna

#2

Hello Anna,

Thanks for writing to us.

To align the Contact envelope icon on the right side with social icon please add this custom CSS code under X-->Theme Option -->CSS

b
b428×725 35.8 KB

.x-topbar .p-info {
    float: right;
}

Regretfully, there is no option to add a search bar in the top bar. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

This could be easily achieved with PRO instead of X. In PRO the You would get header builder to achieve your custom header layout.

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Thanks for understanding

#3

Thank you !
How does it work to go from X to Xpro ?
Do I risk of loosing content etc?

#4

Hello Anna,

You can upgrade your X theme to Pro theme by purchasing Pro theme license. There is no risk of losing content or data if you upgrade your theme from X to Pro theme. I would suggest you to copy your live site to a staging server before upgrading theme form X to Pro theme.

Please have a look at our documentation to learn more about how to upgrade the theme from X to Pro theme.https://theme.co/docs/converting-from-x-to-pro

Thanks

#5

Ok Thank you I will.
I have another issue with a mixed media keeping my site to show as secure on chrome - i located the error, an image file that was not in use - I deleted the file but the error still shows. This is the path to the error but how do I mend it ? https://delosdr.org/wp-content/plugins/cornerstone/assets/dist/js/site/cs.0ce70e6.js.
Thank you once more for your help !

#6

Hey Anna,

I checked your site and the warning comes from http://delosdr.info/wp-content/uploads/2018/01/Screen-Shot-2018-01-18-at-18.48.57.png. You can simply delete it and re-upload the image to fix the Mixed Content warning.

The other warnings are the SourceMap warnings which you can ignore, here’s a thread you can follow to get rid of those warnings https://stackoverflow.com/questions/61339968/devtools-failed-to-load-sourcemap-could-not-load-content-for-chrome-extension

Hope this helps!

#7

Yes well I did delete the image as it was not even in use. But it still points to it and the error remains. Any ideas on how to resolve ?

#8

Hey Anna,

if you have deleted the image then you need to remove it from the content (source) as well where you’ve used it to completely remove the warning.

If you have removed the link from the content as well then this could be just a cache issue, your content could be cached. Try clearing all caches if you are using any cache plugin or server cache so that the code from the latest release is always in use. This will help you to avoid any potential errors.

Let us know how this goes!

#10

Hi again and thank you for your help. Caches cleared. Problem remains, and I actually do not know where to delete the content as this image was not in use, I have tried to find the path to it in the theme editor but cannot find it. I really do not know how to remove it… Really appreciate it if you can help me resolve this!

#11

Hello Anna,

Upon checking the source of your site, I see you’ve used it as a page background image (see screenshot)

image
image1350×73 6.51 KB

To remove it, edit your page in Cornerstone, click on the settings (cog icon) then click on Page Settings tab and under Meta Settings remove the link from Background Image(s) field (see screenshot)

image
image1017×777 12.9 KB

Don’t forget to clear all caches including your browser’s cache after removing the image link. Let us know how this goes!

#12

I see the problem is that the path directs to http://delosdr.info - which is not our domain, so I really do not know how to access it…

#13

Hey Anna,

You can simply remove the image link from your page background field and use another to fix the issue.

Hope this helps!

#14

Yes but which page ?

#15

Hello Anna,

I checked your homepage only so you can remove it from there first and if you have added it on other pages as well then go to each of your page and remove it.

To know how to remove that background image please follow this reply: Topbar search and alignment

Thanks!

#16

Screen Shot 2020-09-19 at 5.53.48 PM
Screen Shot 2020-09-19 at 5.53.48 PM1662×1406 183 KB

I do not seem to have the page settings that you have on your screenshoot - I am sorry that I am not getting this - I really appreciate it if you can help me and direct me to the right location so I can resolve this.

#17

Hey Anna,

It seem like you have gone through the settings via content. You need to first edit your home page in Cornerstone and then you’ll find the Page Settings if you click on the cog icon.

Let us know how this goes!

#18

Thank you infinitely - I found it present on two different pages ! Sorry for the trouble and the misunderstandings

#19

Glad that we could be of help.

Cheers!

#20

HI again, I’ve created a separate search page with cornerstone and would like to just integrate a search icon (loop) in my topbar that directs to this separate page when clicking on it. Would you help me with the code t

#21

Hi @annasenno,

I check your website and you already have a search icon in your header area that redirects to your search page. If you are referring to something else, please provide us a screenshot to better help you with your concern.

Hope that helps.

Thank you.