I want to have a dynamic sidebar for that I use javascript for the active class property to be running, and it works perfectly, but the problem is with the content level of each sidebar because they are different too
code html
<aside class="page-sidebar col-md-2 col-sm-4 affix-top">
<section class="widget">
<ul class="nav">
{% for tache in taches %}
<li class="">{{ tache.titre }}</li>
{% endfor %}
</ul>
</section>
</aside>
<div class="content-wrapper col-md-10 col-sm-8">
<div id="my" class="page-row">
{% include "FrontBundle:Default:my.html.twig" %}
</div>
</div>
I want to know if there is a solution to recover each sidebar to have access to its content e. Because in the twig my.html.twig I want to display the description of each "tache" {{tache.description}}
And thank you in advance
Related
I am using Vichuploader to upload the photos of a category, the problem is that I need to retrieve the image from the css . Background-image and I don't know how to implement the code here.
{{asset ('images/services/')}}{{category.image}} for html template but css ??
style="background-image:url(images/services/image.jpg);"
Help me please.!
I am trying this suggestion :
<div class="row">
{% for category in categories %}
<div class="col-md-6 col-lg-6 ftco-animate">
<div class="block-7">
<div class="img prix"
style="background-image: url('{{
vich_uploader_asset(category, 'image') }}')">
</div>
</div>
</div>
{% endfor %}
</div>
but i have this error :
My Html have this error too:
My Code :
You can use vich_uploader_asset() in a twig file to generate the url for your image:
<div class="img prix"
style="background-image: url('{{ vich_uploader_asset(category, 'imageFile') }}')"
></div>
This twig function is documented here
I have a problem with the visibility of description of ARTICLES in block's post, they are showing other content but not the first paragraph of the article, as it supposed to do.
print screen
here is the code (just the part of the BLOG)
<div class="lp-section blog-section">
<h2>
Blog
</h2>
<ul>
{% set rec_posts = blog_recent_posts("default", 3) %}
{% for rec_post in rec_posts %}
<li>
<div class="lp-block">
{% if rec_post.featured_image %}
<a class="resource__post-image"
alt="{{ rec_post.featured_image_alt_text }}"
style="background-image: url('{{ rec_post.featured_image }}');"
href="{{ rec_post.absolute_url }}">
</a>
{% endif %}
{% set featured_tag = rec_post.topic_list | first %}
{% if featured_tag %}
<div class="content content-description">
<div>
<span class="keyword">{{ featured_tag }}</span>
{% endif %}
<h3>{{ rec_post.name }}</h3>
<p class="description">{{ content.meta_description | default(content.post_summary, true) | truncatehtml(150, '...', false) }}</p>
</div>
<div>
<a class="ghost-cta" href="{{ rec_post.absolute_url }}">
Read more
</a>
</div>
</div>
</div>
</li>
{% endfor %}
</ul>
<a class="link" href="https://ai.reportlinker.com/en/resources/blog">+ More articles </a>
</div>
Could somebody please help me please?
Im trying to add code back into shopify to allow for a comments box at the bottom of blog posts.
from my investigating, the code should exist in article.liquid, however it looks like the original developer deleted it.
I have tried entering code from Shopifys example https://shopify.github.io/liquid-code-examples/example/comment-list which produced no changes (Also I can't see there being an option to 'moderate' the comments, ideally we want to check them before they're posted on site.
Also tried a code from Github https://github.com/Shopify/Timber/blob/master/templates/article.liquid, which resulted in the below image. This code mentions 'moderate', but it didn't work.
github code error
Has anyone experience similar issue?
this is the current article.liquid code:
<div class="small-12 columns">
<article class="single-article">
<div class="article__title">
<h1 class="impact alpha">{{ blog.title }}</h1>
<h3 class="impact gamma">
<time pubdate datetime="{{ article.published_at | date: '%Y-%m-%d' }}">{{ article.published_at | date: '%b %d, %Y' }}</time> | {{ blog.title }}
</h3>
</div>
<div class="article__feature-image">
<img src="{{ article.image.src | img_url: '1024x1024' }}" alt="{{ article.image.alt }}">
</div>
<div class="article__content">
<div class="row">
<div class="small-12 medium-8 medium-offset-2 columns rte">
{{ article.content }}
</div>
</div>
</div>
<div class="article__paginate">
{% if blog.next_article or blog.previous_article %}
<div class="row">
<div class="small-12 medium-8 medium-offset-2 columns rte">
<p class="clearfix">
{% if blog.next_article %}
<span class="left impact epsilon">{{ '← Next Post' | link_to: blog.next_article }}</span>
{% endif %}
{% if blog.previous_article %}
<span class="right impact epsilon">{{ 'Previous Post →' | link_to: blog.previous_article }}</span>
{% endif %}
</p>
</div>
</div>
{% endif %}
</div>
<div class="article__author">
<div class="row">
<div class="small-12 medium-8 medium-offset-2 columns">
<div class="row">
<div class="author-image small-12 medium-3 columns">
<img src="http://www.gravatar.com/avatar/{{ article.user.email | md5 }}?s=100" />
</div>
<div class="author-details small-12 medium-9 columns">
<h4 class="impact epsilon">Written by {{ article.author }}</h4>
<p>{{ article.user.bio }}</p>
</div>
</div>
</div>
</div>
</div>
<div class="article__social clearfix">
<div class="row">
<div class="small-12 medium-8 small-centered columns">
<h4 class="epsilon impact">Share This</h4>
<br>
{% include 'snippets_share' %}
</div>
</div>
</div>
</article>
</div>
this is probably an easy one, I need help with an if statement so my button only shows on specific product types.
<button id="myBtn">Size Guide</button>
<div id="myModal" class="modal">
<div class="modal-content">
<span class="close">×</span>
<img style="margin:auto; width:100%" class="modal-size-chart" src="https://cdn.shopify.com/s/files/1/0278/2842/0746/t/3/assets/{{ product.vendor }}.jpg"></img>
</div>
</div>
<div id="myModal" class="modal">
<div class="modal-content">
<span class="close">×</span>
<img style="margin:auto; width:100%" class="modal-size-chart" src="https://cdn.shopify.com/s/files/1/0278/2842/0746/t/3/assets/{{ product.vendor }}.jpg"></img>
</div>
</div>
{% if product.type == "myType" %}
<button id="myBtn">Size Guide</button>
{% endif %}
More information on product.type here
More information on if here
I have been creating a blog and I have made these cards but I want the content to stack side by side rather than on top of each other.
Here's an image:
http://imgur.com/KP7kThH
model.py
class ProjectPost(models.Model):
title = models.CharField(max_length=120)
author = models.ForeignKey('auth.User')
image_url = models.CharField(max_length=1000, blank=True, null=True)
text = models.TextField()
def __str__(self):
return self.title
views.py
def projects(request):
ProjectPosts = ProjectPost.objects.all()
return render(request, 'blog/projects.html', {'projectposts': ProjectPosts})
projects.html
{% extends 'blog/base.html' %}
{% block content %}
{% if user.is_authenticated %}
<div class="container-fluid">
<div class="row">
<div class="text-right">
<h1 class="glyphicon glyphicon-plus"></h1>
</div>
</div>
</div>
{% endif %}
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-4 col-xs-10 ">
{% for projectpost in projectposts %}
<div class="projectposts">
<img src="{{ projectpost.image_url }}" id="projects_image" class="img-thumbnail"/>
<div class="page-header">
<h2>{{ projectpost.title }}</h2>
</div>
<footer>By: {{ projectpost.author }}</footer>
<p>{{ projectpost.text | truncatewords:50 }}</p>
</div>
{% endfor %}
</div>
</div>
</div>
{% endblock %}
You have wrapped your for loop inside a col-lg-3 .... You need to put the column classes inside the loop, not outside it:
<div class="row">
{% for projectpost in projectposts %}
<!-- These columns need to be inside the for loop -->
<div class="col-lg-3 col-md-3 col-sm-4 col-xs-10 ">
<div class="projectposts">
...
</div>
</div>
{% endfor %}
</div>
You may be able to remove one level of nesting and just put all your classes in one <div class="projectposts col-lg-3 col-md-3...">.