How to do 'featured products' like momiji

by ikram - Member - 11:49AM, Apr 22, 2008

I am very new to liquid so please, any direction would be great. I’ve managed to use the ripen template and make it my own but I was wondering how these people did their ‘featured product’ look?

http://www.welovemomiji.co.uk/

Did they use filters? use a hack with the blog page (someone did this but I lost the thread URL)

hopefully someone can show me the way :)

p/s – this is my url http://recwhse.myshopify.com/ am trying to list the featured products beneath the paypal logo.

Last edited 12:04PM, Apr 22, 2008

iammikec

Member

01:45PM, Apr 22, 2008

Hi Ikram

I haven’t done anything special to add featured products throughout my site – it comes straight out the box with the vogue template.

If you haven’t done so already, my suggestion would be to download vision, which includes all of the available templates. You will then be able to see all of the code (including liquid statements) used for other templates and their CSS and integrate whatever you want.

ikram

Member

02:44PM, Apr 22, 2008

Thanks for the reply!

oh you mean, just copy and paste..hmm…

I know i can do this trial and error thing, but how does the system choose your new products for welovemomiji? I read the code on ripen template which showed only 3. I may want to do like yours, and even have nice rollover effects and symmetrical size for them thumbnails.

<div class="featured-prod-row clearfix">
        {% for product in collections.frontpage.products %}
            <div class="featured-prod-item">
                <p>
                <a href="{{product.url}}"><img src="{{ product.featured_image | product_img_url: 'small' }}" alt="{{ product.title }}"/></a>    
                </p>
                <h4><a href="{{product.url}}">{{product.title}}</a></h4>
                {% if product.compare_at_price %} 
                    {% if product.price_min != product.compare_at_price %}
                        <p class="prd-price">Was:<del>{{product.compare_at_price | money}}</del></p>
                        <p class="prd-price"><ins>Now: {{product.price_min | money}}</ins></p>
                    {% endif %}
                {% else %}
                    <p class="prd-price"><ins>{{product.price_min | money}}</ins></p>
                {% endif %}
            </div>
        {% endfor %}
    </div>

this is the code from the ripen template. Should I just use this first?

ikram

Member

02:45PM, Apr 22, 2008

Oh my bad! I didn’t see you say vogue template. I’ll check it out :)

You must login to post a comment!

Don't have an account yet? Sign up for one.