Some additions for everyone who is also working with Magento 2.2.x.
You can pretty much do exactly the same as in Magento 2.1.x by starting with:
In your custom theme add:
app\design\frontend\CustomVendor\theme-custom\Magento_Catalog\layout\catalog_product_view.xml
In this file we are going to tell Magento to move the reviews block as follows:
<?xml version="1.0"?>
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<move element="reviews.tab" destination="content" after="product.info.details" />
</body>
</page>
For Magento 2.2.x this command alone will create a 'bug' where the reviews of the product won't show up, but the form will. To fix this issue we are gonna copy the following file:
vendor\magento\module-review\view\frontend\web\js\process-reviews.js
And place it in your custom theme in the following path:
app\design\frontend\CustomVendor\theme-custom\Magento_Review\web\js\process-reviews.js
In this file go to line and comment those out 40-43 and 44-49 it should look as follows:
return function (config) {
// var reviewTab = $(config.reviewsTabSelector),
// requiredReviewTabRole = 'tab';
// if (reviewTab.attr('role') === requiredReviewTabRole && reviewTab.hasClass('active')) {
processReviews(config.productReviewUrl);
// } else {
// reviewTab.one('beforeOpen', function () {
// processReviews(config.productReviewUrl);
// });
// }
$(function () {
$('.product-info-main .reviews-actions a').click(function (event) {
var acnchor;
event.preventDefault();
acnchor = $(this).attr('href').replace(/^.*?(#|$)/, '');
$('.product.data.items [data-role="content"]').each(function (index) { //eslint-disable-line
if (this.id == 'reviews') { //eslint-disable-line eqeqeq
$('.product.data.items').tabs('activate', index);
$('html, body').animate({
scrollTop: $('#' + acnchor).offset().top - 50
}, 300);
}
});
});
});
};
We are telling Magento not to check if the reviews are in a tab but just render them either way.
Don't forget to recreate the symlinks in pub static by doing the following command in your CLI in the root of your Magento 2 store:
rm -rf pub/static/*
Always be careful with the rm -rf command because if you type the path incorrectly you might remove the entire directory!
That should do the trick!
Change your default.xml to
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="header-wrapper">
<block class="Magento\Framework\View\Element\Template" name="top.line" template="Magento_Theme::topline.phtml" />
</referenceContainer>
</body>
</page>
If you want to add your block to top header change <referenceContainer/>
to
<referenceContainer name="header.panel">
Now flush cache and try.
Best Answer
Place this XML in your theme folder:
Don't forget clear cache. Message me if you will have any issues.