From 205fb9f184f1c848e8fc4e7b94f446b7c1758346 Mon Sep 17 00:00:00 2001 From: Tomasz Kikowski Date: Fri, 3 Aug 2018 13:52:20 +0200 Subject: [PATCH 1/5] First variant sku as default in products's URL --- config/default.json | 1 + core/pages/Product.js | 6 ++++-- core/store/modules/product/actions.js | 3 +++ src/themes/default/pages/Home.vue | 4 ++-- 4 files changed, 10 insertions(+), 4 deletions(-) diff --git a/config/default.json b/config/default.json index 85ec4c02db..80e315b048 100644 --- a/config/default.json +++ b/config/default.json @@ -116,6 +116,7 @@ "products": { "useShortCatalogUrls": false, "useMagentoUrlKeys": false, + "setFirstVarianAsDefaultInURL": false, "configurableChildrenStockPrefetchStatic": false, "configurableChildrenStockPrefetchDynamic": false, "configurableChildrenStockPrefetchStaticPrefetchCount": 8, diff --git a/core/pages/Product.js b/core/pages/Product.js index 20f8b03e33..c8af5ebffd 100644 --- a/core/pages/Product.js +++ b/core/pages/Product.js @@ -101,7 +101,7 @@ export default { return store.dispatch('product/fetchAsync', { parentSku: route.params.parentSku, childSku: route && route.params && route.params.childSku ? route.params.childSku : null }) }, watch: { - '$route': 'validateRoute' + '$route.params.parentSku': 'validateRoute' }, beforeDestroy () { this.$bus.$off('product-after-removevariant') @@ -129,7 +129,6 @@ export default { inst.loading = false inst.defaultOfflineImage = inst.product.image this.onStateCheck() - this.$bus.$on('filter-changed-product', this.onAfterFilterChanged) }).catch((err) => { inst.loading = false console.error(err) @@ -211,6 +210,9 @@ export default { selectDefaultVariant: true, fallbackToDefaultWhenNoAvailable: false }).then((selectedVariant) => { + if (config.products.setFirstVarianAsDefaultInURL) { + this.$router.push({params: { childSku: selectedVariant.sku }}) + } if (!selectedVariant) { if (typeof prevOption !== 'undefined' && prevOption) { this.configuration[filterOption.attribute_code] = prevOption diff --git a/core/store/modules/product/actions.js b/core/store/modules/product/actions.js index af52a96910..af11da8266 100644 --- a/core/store/modules/product/actions.js +++ b/core/store/modules/product/actions.js @@ -245,6 +245,9 @@ export default { if (!product.parentSku) { product.parentSku = product.sku } + if (config.products.setFirstVarianAsDefaultInURL && product.hasOwnProperty('configurable_children') && product.configurable_children.length > 0) { + product.sku = product.configurable_children[0].sku + } if (configuration) { let selectedVariant = configureProductAsync(context, { product: product, configuration: configuration, selectDefaultVariant: false }) Object.assign(product, selectedVariant) diff --git a/src/themes/default/pages/Home.vue b/src/themes/default/pages/Home.vue index b09d778044..7c187d9418 100755 --- a/src/themes/default/pages/Home.vue +++ b/src/themes/default/pages/Home.vue @@ -95,7 +95,7 @@ export default { query: newProductsQuery, size: 8, sort: 'created_at:desc', - includeFields: config.entities.optimize ? config.entities.productList.includeFields : [] + includeFields: config.entities.optimize ? (config.products.setFirstVarianAsDefaultInURL ? config.entities.productListWithChildren.includeFields : config.entities.productList.includeFields) : [] }).then(function (res) { if (res) { store.state.homepage.new_collection = res.items @@ -105,7 +105,7 @@ export default { query: coolBagsQuery, size: 4, sort: 'created_at:desc', - includeFields: config.entities.optimize ? config.entities.productList.includeFields : [] + includeFields: config.entities.optimize ? (config.products.setFirstVarianAsDefaultInURL ? config.entities.productListWithChildren.includeFields : config.entities.productList.includeFields) : [] }).then(function (res) { if (res) { store.state.homepage.coolbags_collection = res.items From 1086367937598df6da4ce8589bb89b6d497d56ac Mon Sep 17 00:00:00 2001 From: Tomasz Kikowski Date: Fri, 3 Aug 2018 14:46:26 +0200 Subject: [PATCH 2/5] Fixes for meta desciption on product pages --- core/filters/index.js | 4 +++- core/filters/strip-html/index.js | 8 ++++++++ core/pages/Product.js | 4 ++-- 3 files changed, 13 insertions(+), 3 deletions(-) create mode 100644 core/filters/strip-html/index.js diff --git a/core/filters/index.js b/core/filters/index.js index 71c89e08f8..f649e07fa5 100644 --- a/core/filters/index.js +++ b/core/filters/index.js @@ -3,11 +3,13 @@ import { htmlDecode } from './html-decode' import { date } from './date' import { capitalize } from './capitalize' import { formatProductMessages } from './product-messages' +import { stripHTML } from './strip-html' export { price, htmlDecode, date, capitalize, - formatProductMessages + formatProductMessages, + stripHTML } diff --git a/core/filters/strip-html/index.js b/core/filters/strip-html/index.js new file mode 100644 index 0000000000..2f6c5f6d29 --- /dev/null +++ b/core/filters/strip-html/index.js @@ -0,0 +1,8 @@ +/** + * Strip HTML tags + * @param {String} html + */ +export function stripHTML (html) { + if (!html) return '' + return html.replace(/<[^>]+>/g, '').trim() +} diff --git a/core/pages/Product.js b/core/pages/Product.js index c8af5ebffd..8c07ab86a6 100644 --- a/core/pages/Product.js +++ b/core/pages/Product.js @@ -7,7 +7,7 @@ import uniqBy from 'lodash-es/uniqBy' import i18n from 'core/lib/i18n' import config from 'config' import EventBus from 'core/plugins/event-bus' -import { htmlDecode } from 'core/filters/html-decode' +import { htmlDecode, stripHTML } from 'core/filters' // Core mixins import Composite from 'core/mixins/composite' @@ -234,7 +234,7 @@ export default { metaInfo () { return { title: htmlDecode(this.$route.meta.title || this.productName), - meta: this.$route.meta.description ? [{ vmid: 'description', description: htmlDecode(this.$route.meta.description) }] : [] + meta: [{ vmid: 'description', description: this.product.short_description ? stripHTML(htmlDecode(this.product.short_description)) : htmlDecode(stripHTML(this.product.description)) }] } } } From 05d1c43392b13efbd9c6eb563fdbd57793725ae5 Mon Sep 17 00:00:00 2001 From: Tomasz Kikowski Date: Fri, 3 Aug 2018 15:10:05 +0200 Subject: [PATCH 3/5] Add robots meta tag --- src/themes/default/resource/head.js | 1 + src/themes/theme-starter/resource/head.js | 1 + 2 files changed, 2 insertions(+) diff --git a/src/themes/default/resource/head.js b/src/themes/default/resource/head.js index 4f8c7431a2..7e38b3a370 100644 --- a/src/themes/default/resource/head.js +++ b/src/themes/default/resource/head.js @@ -8,6 +8,7 @@ export default { { charset: 'utf-8' }, { vmid: 'description', name: 'description', content: 'Vue Storefront is a standalone PWA storefront for your eCommerce, possible to connect with any eCommerce backend (eg. Magento, Prestashop or Shopware) through the API.' }, { name: 'viewport', content: 'width=device-width, initial-scale=1, minimal-ui' }, + { name: 'robots', content: 'index, follow' }, { name: 'mobile-web-app-capable', content: 'yes' }, { name: 'theme-color', content: '#ffffff' }, { name: 'apple-mobile-web-app-status-bar-style', content: '#ffffff' } diff --git a/src/themes/theme-starter/resource/head.js b/src/themes/theme-starter/resource/head.js index 38f2879be8..8a8dfd891f 100644 --- a/src/themes/theme-starter/resource/head.js +++ b/src/themes/theme-starter/resource/head.js @@ -8,6 +8,7 @@ export default { { charset: 'utf-8' }, { vmid: 'description', name: 'description', content: 'Vue Storefront is a standalone PWA storefront for your eCommerce, possible to connect with any eCommerce backend (eg. Magento, Prestashop or Shopware) through the API.' }, { name: 'viewport', content: 'width=device-width, initial-scale=1, minimal-ui' }, + { name: 'robots', content: 'index, follow' }, { name: 'mobile-web-app-capable', content: 'yes' }, { name: 'theme-color', content: '#f60' }, { name: 'apple-mobile-web-app-status-bar-style', content: 'black-translucent' } From 56ca3e647600922d945b7e40ee794d83635a39ad Mon Sep 17 00:00:00 2001 From: Tomasz Kikowski Date: Fri, 3 Aug 2018 15:58:51 +0200 Subject: [PATCH 4/5] Add microdata atributes to product page --- core/pages/Product.js | 4 + .../components/core/ProductGallery.vue | 2 + src/themes/default/pages/Product.vue | 175 +++++++++--------- 3 files changed, 96 insertions(+), 85 deletions(-) diff --git a/core/pages/Product.js b/core/pages/Product.js index 8c07ab86a6..d905ce54e2 100644 --- a/core/pages/Product.js +++ b/core/pages/Product.js @@ -8,6 +8,7 @@ import i18n from 'core/lib/i18n' import config from 'config' import EventBus from 'core/plugins/event-bus' import { htmlDecode, stripHTML } from 'core/filters' +import { currentStoreView } from '@vue-storefront/store/lib/multistore' // Core mixins import Composite from 'core/mixins/composite' @@ -94,6 +95,9 @@ export default { }, isOnCompare () { return !!this.$store.state.compare.items.find(p => p.sku === this.product.sku) + }, + currentStore () { + return currentStoreView() } }, asyncData ({ store, route }) { // this is for SSR purposes to prefetch data diff --git a/src/themes/default/components/core/ProductGallery.vue b/src/themes/default/components/core/ProductGallery.vue index 72bd61cdaa..feab9d9d0c 100644 --- a/src/themes/default/components/core/ProductGallery.vue +++ b/src/themes/default/components/core/ProductGallery.vue @@ -40,6 +40,7 @@ class="mw-100 pointer" ref="defaultImage" alt="" + itemprop="image" > @@ -66,6 +67,7 @@ @dblclick="toggleZoom" alt="" data-testid="productGalleryImage" + itemprop="image" > diff --git a/src/themes/default/pages/Product.vue b/src/themes/default/pages/Product.vue index 5da09be766..6070bc0410 100644 --- a/src/themes/default/pages/Product.vue +++ b/src/themes/default/pages/Product.vue @@ -1,5 +1,5 @@