Правки WordPress страницы блога https://www.artlook.us/

Сайт сделан на самописной теме WordPress

Шаблон https://www.figma.com/file/HsYPO49ikWOHjvpwHmVzKu/blog-artlook

Необходимо переделать страницу статьи блога согласно шаблону с адаптивными версиями. 

Ниже прописаны уточнения от СЕО специалистов их нужно придерживаться.

1. Этот элемент - h1 и является названием статьи https://drive.google.com/file/d/1PHRK9L7UNNJgtrl229YURxolXLfkXrte/view?usp=drivesdk

2. Первая картинка - это картинка превью, указанная в админке https://drive.google.com/file/d/1tzLM9tJk3mNnAUPWdL-39j-N2RSAe6E9/view?usp=drivesdk

3. Изображение https://drive.google.com/file/d/1tzLM9tJk3mNnAUPWdL-39j-N2RSAe6E9/view?usp=drivesdk должно иметь размер блока, в котором оно вставлено. Т.е. если блок размером 700х500 пикселей, картинка превью должна автоматически уменьшаться до нужного размера, вне зависимости от того, какого размера картинку загрузил редактор.

4. Этот элемент - тег <blockquote>  https://drive.google.com/file/d/1HcznYINmg0sj4tMFkqx6nfYomHFbokN1/view?usp=drivesdk

5. Элемент "картинка во всю ширину статьи" https://drive.google.com/file/d/1N1mvloHuqc2NwWth2Z3DPuX-E-ERDtIJ/view?usp=drivesdk должен автоматически  обрезать картинку по максимальной ширине блока для компьютеров. Т.е. если ширина статьи 700 пикселей, а редактор загрузил картинку шириной 1200 пикселей, то в статье она должна автоматически уменьшаться до размера 700 пикселей (размеры взяты для примера)

6. В элементе "картинка справа" https://drive.google.com/file/d/16j_dPZ0P3bkXoB3G5YC-v1O8YLEFJdQu/view?usp=drivesdk  Изображение должно иметь размер блока, в котором оно вставлено. Т.е. если блок размером 700х500 пикселей, картинка должна автоматически уменьшаться до нужного размера, вне зависимости от того, какого размера картинку загрузил редактор.

7. Это https://drive.google.com/file/d/1Gg8YUw-ngQes8Cu2_y6fT8NTSoYqZdik/view?usp=drivesdk вёрстка элемента <ul><li></li></ul>

8. Это 
https://drive.google.com/file/d/1ZQD60cRWEoJ2ZcLPmbktCl2TxHl9L_FG/view?usp=drivesdk вёрстка элемента <ol><li></li></ol>

9. Это https://drive.google.com/file/d/1haB4syW14yWOiLK5HjUlaZo4TQvXa3kw/view?usp=drivesdk вёрстка элемента <table>

10. Элементы Content Box и Spoiler должны быть сделаны из элементов <div>. Без <strong>, <p> <br> и т.д.

11. Элемент share with friends https://drive.google.com/file/d/15-BWMte4AMIp4Cz9_4cddytDcx1ki7ex/view?usp=drivesdk должен быть сделан с помощью внутренних скриптов, без подключения сторонних сервисов

12. Элемент Gallery https://drive.google.com/file/d/1Mj2Edu0-6zKwVnSJG2PcfpEWh5-LRVZ2/view?usp=drivesdk должен быть свёрстан на основе стандартной галереи Worrpress, без использования сторонних плагинов (https://wordpress.org/support/article/the-wordpress-gallery/)

Микроразметка

1. Хлебные крошки (https://drive.google.com/file/d/1-exh69eVdWmfP9G6dFDptbCgfwKCczrv/view?usp=drivesdk)

 - https://schema.org/BreadcrumbList 

 - https://developers.google.com/search/docs/advanced/structured-data/breadcrumb?hl=ru

2. Статья целиком 

 - https://schema.org/Article

 - https://developers.google.com/search/docs/advanced/structured-data/article?hl=ru

3. Каждая картинка внутри статьи 

 - https://schema.org/ImageObject

4. Каждое видео, вставленное в статью

 - https://schema.org/VideoObject

 - https://developers.google.com/search/docs/advanced/structured-data/video?hl=ru

5. Комментарии к статье 

 - https://schema.org/Comment

6. Звёздный рейтинг, выставляемый пользователями

 - https://schema.org/Rating