При создании посадочной страницы на Wordpress может потребоваться вывод полной информации из карточки товара: фото, цену, кнопку купить, детальное описание. Фактически это карточка товара, но на стандартной странице или в записи.
Для этого можно использовать следующий шорткод:
[product_page id="xxxxx"]
Узнать id товара можно в админке, в разделе Все товары, наведя мышкой на название товара, слева внизу появится url адрес, содержащий id после знака равно.
Сам шорткод может вставляться прямо в редакторе, в текст страницы.
В php шорткод выводится следующей строкой:
echo do_shortcode('[product_page id="xxxxx"]');
В некоторых случаях вывод карточки товара на странице может оказаться некорректным. Например, фото может быть не на 50% ширины блока, а на 100%. Также шрифты, цвет, и прочие свойства могут отличаться от того, что выводится в шаблоне карточки товара установленной темы.
Дело в том, что в теме в стилях могут использоваться по несколько селекторов. В таком случае может потребоваться корректировка стилей темы.
Например, в стилях темы может использоваться такой селектор:
.site-content-single-product .single-product-info .single-product-image-wrap
Но отсутствует такой:
.single-product-image-wrap
В карточке товара, выводимой с помощью шорткода классы site-content-single-product и single-product-info отсутствуют, поэтому стили шаблона не применятся. В таком случае, в коде страницы можно добавить классы site-content-single-product и single-product-info до шорткода, либо в файл css добавить селектор .single-product-image-wrap или свою комбинацию селекторов.