I have a simple <a> in a page which is using FrameWork7 as follows:

<li><a href="/"><img src="images/icons/black/users.png" alt="" title="" /><span>Go Google/span></a></li>

But when I click on that it is not redirecting to google page. I have checked console and it shows as follows:

XMLHttpRequest cannot load /. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
framework7.js:12307 XHR failed loading: GET "/".$.ajax @ framework7.js:12307app.get @ framework7.js:1652app.router.load @ framework7.js:2648load @ framework7.js:636handleClicks @ framework7.js:7573handleLiveEvent @ framework7.js:11488

I am new to Framework7. I have purchased a template for development.

I have a simple <a> in a page which is using FrameWork7 as follows:

<li><a href="https://www.google./"><img src="images/icons/black/users.png" alt="" title="" /><span>Go Google/span></a></li>

But when I click on that it is not redirecting to google page. I have checked console and it shows as follows:

XMLHttpRequest cannot load https://www.google./. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
framework7.js:12307 XHR failed loading: GET "https://www.google./".$.ajax @ framework7.js:12307app.get @ framework7.js:1652app.router.load @ framework7.js:2648load @ framework7.js:636handleClicks @ framework7.js:7573handleLiveEvent @ framework7.js:11488

I am new to Framework7. I have purchased a template for development.

• javascript
• ajax
• html-framework-7

2 Answers 2

As the docs says :

It is possible to bypass F7 link handler (if you want to add custom logic to link, or want it to direct to external website). In this case we need additional external class

<a class="link external" href="http://google.">Open Google</a>

You want link to outside of your Framework7 application, so just add external class to your a href and its working properly

<li><a href="https://www.google./" class="external"><img src="images/icons/black/users.png" alt="" title="" /><span>Go Google</span></a></li>

and see you have typo on write down the closing span tag

You didn't clossed the span, also add a target:

<li><a href="https://www.google./" target="_blank"><img src="images/icons/black/users.png" alt="" title="" /><span>Go Google</span></a></li>