Liquid - get product ID and display custom/specific information dynamically - shopify

I am trying to add a small 'lockup' / promo to a page that loads information dynamically based on page.metafield information. Replacing images, video ID's etc. Which all works just fine.
My client is asking for a small area to display a product that relates to this dynamically changing content and I am struggling to come up with a good way to do this.
The current setup is that we have 30 pages with a set of 8 metafields each page. Each one of these pages must show a different , single product with an image, title, price, buy button and another button that links out to a partner site.
I can create snippet and load almost all of this info through metafields manually (price, title etc the client could just add to another metafield) but I would prefer to load a product to pull this info so it can be added to cart. Although I can add product data manually, I still don't actually know which product will get added to the cart, because I'm on a 'page' not a 'product'.
The products themselves are using a custom template that is different to the rest of the site so that seems like its not an option. The template for this content page is just 'page' but surely I can call the product object someway? If the client entered a product ID in the metafields, is there a way of pulling that IDs data easily?

Whatever you mean by pulling ID's, but there are a couple of ways of dealing with this. One, you have a Storefront API token, allowing you to freely and securely call Shopify with JS and get back all the data about the ID you're interested in. Or, you have an App installed in the store, in which case you can setup and callback an App Proxy, providing that ID, and getting back all the info you need. Lots of options!

Related

How can I create a metafield with the type: product, for a shopify input?

I have made several metafields with the type as product, so I know they work, but in this section they don't show up for this link. I can hardcode the link to a specific product, but I want it to be dynamic using metafields. I'm using the palo alto theme.
and this is the result when I click the dynamic source button:
I'd rather leave any theme customization or coding as a last resort.
A link would take a metafield of type url but you are trying to add a metafield of type product. Type product stores the product object with all its data that's not what you need here if you just need to link to the product page.
Id just set up another metafield of type url and pop the url of the product in there.
I'm not familiar with where you are adding this in the Palo Alto theme but unless this is a section that appears on multiple pages, like product pages or blog pages, where you need to link to a different product on each page you may not need a metafield at all.

OroCommerce: Configurable Product display in storefront and backoffice

I've created configurable product (internet connection with different speed) following docs, in storefront I see dropdown with product vairants, all is ok.
But in backoffice (when editing shoppingList or creating order) there is always only one variant of product with no ability to quickly select another option (eg change speed to another one) - is this how oro backoffice works and nothing could be changed to make backoffice user quickly navigate between product variants (eg change speed from 1M to 2M by clients phone request)?
Cant even edit product in shopping list
UPD:
If there's no way to see user-friendly configurable product in backoffice than I need to implement smth like button near each product in LineItem which will show popup with product variants. When user will select another option request will be sent to some route and it will run smth like $lineItem->setProduct($newProduct); , grid reloaded and new product variant selected. Is it ok or it will break something in oro?
Where to start for adding that button and popup? Eg I cant edit oro shopping list template, how to properly extend it?
On the line item editing form you cannot change the product, no matter it's configurable or simple. It's done intentionally.
If you want to change the product, you always can remove a line item and add the new one with updated options manually:

How to integrate vue with custom routing into an existing regular website?

I’d like to integrate vue into a existing webproject. In detail I want to use vue to integrate data from www.autoscout24.de into a website which basically uses Modx-cms, which means that the routing generally takes place inside Modx. With vue I want to realize a search form which I can integrate anywhere inside the existing website. The results should display under something like domain.tld/cars and a single car should be displayed at something like domain.tld/cars/cardetails#8574746
So regarding the routing I guess /cars and /cars/cardetails will be regular sites of the cms (vue only shows the data) but the Hashtag-routing for cardetails will be handled by vue, right?
As the App (should I call it three different apps?) will not be a SAP how can I pass data between the search form, /cars and /cars/cardetails#xyz? Is local storage the way to go?
Is that the right approach. Maybe my approach is even completely wrong, as I am new to vue?
Some further details regarding the app:
The searchform will react to every user input with a request to the Graph QL-Api in order to show the user live how many results he will get. Above the form there will be a teaser with around 10 random cars. After submitting the form the user is directed to /cars where he receives his resultslist (photos of the cars + some quick information). Above the list I want to show the filters so the user can adjust the resultslist. When the user clicks on the car he will get directed to /cars/cardetails#xyz where xyz is the id of the car in order to fetch the cardetails from the api via js/graphql.
Kind regards
Here are some screens to illustrate it. The parts which should be realized with vue are marked red.

Shopify - Product filter with parameter

I am looking for custom product filter using my custom Shopify App. I have created an app like structure and which is append to the product collection template.
How can I pass custom parameters like price, category or product attributes via URL or how it will render the product on the collection page.
Thanks,
Navas
If you created an App, you can add a Proxy to it. The Proxy allows Shopify to send secure data to your App via a Javascript call. You get the data from the shop about the product, you filter it, and you return JSON data if you want, to help the front end. Works great. Try it.

Shopify draft order custom items - Images

I have created an app that uses the Shopify draft order API to create a number of custom items based on interactions in the app so that the customer can checkout their items using Shopify.
I'd like to add image thumbnails to the items, ideally just by supplying a URL to the image file, yet I can not seem to find a way to do this in the API reference.
When creating a draft order via API call using custom line items, rather than existing products, is there a way to add thumbnail images on those custom line items?