In my next js project I have the following:
<h4 className="caption-title">
<Link href="/products">
<a>{key}</a>
</Link>
</h4>
The link appears on my page and I click on it but it doesn't go to the page products.
in pages directory I have products.js
When clicked the url displayed is: http://localhost:3000/products but it does NOT go to the page.
If I manually hit this: http://localhost:3000/products then it works.
Am I missing something I should be adding?
Related
I have a post card, which if clicked brings you to the post's page, i also have a link inside the post card which when clicked brings you to the album of posts the post is from.
The code structure is similar to this one:
<Link href={post.url} className={styles.post}>
...title and stuff
<Link href={post.groupUrl}>
{post.group}
</Link>
</Link>
It worked before updating to Nextjs 13
This is less of a Next.js bug because, at the end, the Link component is just a fancy a tag and also gets rendered as one in the DOM. And, as you can read here, nesting links is illegal.
I have a footer CTA widget (Best Quality Guarantee) that is appearing on all of the pages on my site, besides the shop and product archive pages.
How do I get it to appear on these pages as well?
The code for the widget is here -
<div>
<a class="best-quality-link" href="/best-quality-flowers"><img src="/wp-content/uploads/2018/07/Better.svg" alt="Best Quality Flowers" /></a>
<hr class="separator" />
</div>
You can see the Best Quality image on the bottom of this page - www.flowersforeveryone.co.za
But it doesn't appear on this page - https://flowersforeveryone.co.za/product-category/roses/
looking at your source code on the archive page it shows that better.svg is definiteley there but it looks like your lazy-loading isn't triggering and displaying it as it still has the 'lazy-hidden' class attached to it. Try disabling lazy load and see if it appears. If it does, then try play with your lazy load plugin settings and if that fails try use a different plugin.
How to enable images to be shown when a link is shared in whatsapp? Like the link above from amprandom.blogspot.com.
OG tags modified as needed. Still does not show images. How to get it work?
You can use the Sharing Debugger to see the information that is used when your website content is shared on Facebook, Messenger and other places. The Batch Invalidator will let you refresh this information for multiple URLs at the same time. Open Graph markup lets you take control over how your website content appears to others.
Reference: https://developers.facebook.com/tools/debug/
Steps:
Add needed og tags ex. og:title, og:image, etc in your website code.
After adding necessary tags, go to Sharing Debugger and enter your website URL there.
Click on Debug. It will show all the data scrapped by it and refreshes them.
Next time you share your website/link, it will scrap metadata added to it.
Edit:
You need to add itemprop to the og:image meta-tag
Ex: change value of url_image to your image/ logo/ favicon url.
<meta property="og:image" itemprop="image" content="url_image">
Thumbnail schema from schema.org inside for WhatsApp
<link itemprop="thumbnailUrl" href="url_image">
<span itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject">
<link itemprop="url" href="url_image">
</span>
I created a website which is located on my document folder at Visual Studio 2008\WebSites\MyWebsite\Orders folder.
There is no problem to open the default page when I clicked starting debugging on menu tool bar. However when I go to another page, the url is not correct because it doesn't include the website name. The URL for default page is
http://localhost:64121/Orders/Default.aspx and the search page is http://localhost:64121/Search.asp. How can I change the setting to make it work without change the script on aspx page. Thank in advance.
there is the href to open another page in apsx page.
<a class="leftnavBody" href="/Search.aspx">Search Order</a></li>
If you have Search.aspx available in the same folder as your default.aspx, use
<a class="leftnavBody" href="Search.aspx">Search Order</a></li>
If Search.aspx is level up i.e. on root and default.aspx in some folder
<a class="leftnavBody" href="/Search.aspx">Search Order</a></li>
I added a like button to my index.php and single.php on yssencial.com (using wordpress)
but on the main page (index.php) it is not sharing the article but the site url (www.yssencial.com) instead.
You need to set the data-href property of the individual posts to your posts url. Otherwise it will use the page that it is actually on, eg your home page.
<div class="fb-like" data-href="http://www.yssencial.com/2011/09/20/terra-nova-quando-o-parque-jurassico-encontra-a-maquina-do-tempo/" data-send="false" data-layout="button_count" data-width="140" data-show-faces="true"></div>