@ -0,0 +1,44 @@ |
|||
.. image:: https://img.shields.io/badge/licence-AGPL--3-blue.svg |
|||
:target: http://www.gnu.org/licenses/agpl-3.0-standalone.html |
|||
:alt: License: AGPL-3 |
|||
|
|||
Insta Feed Snippet |
|||
=================== |
|||
|
|||
Insta Feed Snippet |
|||
|
|||
Installation |
|||
============ |
|||
- www.odoo.com/documentation/15.0/setup/install.html |
|||
- Install our custom addon |
|||
|
|||
Company |
|||
------- |
|||
* `Cybrosys Techno Solutions <https://cybrosys.com/>`__ |
|||
|
|||
Credits |
|||
------- |
|||
* Developer: |
|||
vishnu@cybrosys.info |
|||
Version 14.0.1.0.0: |
|||
|
|||
Contacts |
|||
-------- |
|||
* Mail Contact : odoo@cybrosys.com |
|||
|
|||
Bug Tracker |
|||
----------- |
|||
Bugs are tracked on GitHub Issues. In case of trouble, please check there if your issue has already been reported. |
|||
|
|||
Maintainer |
|||
========== |
|||
.. image:: https://cybrosys.com/images/logo.png |
|||
:target: https://cybrosys.com |
|||
|
|||
This module is maintained by Cybrosys Technologies. |
|||
|
|||
For support and more information, please visit `Our Website <https://cybrosys.com/>`__ |
|||
|
|||
Further information |
|||
=================== |
|||
HTML Description: `<static/description/index.html>`__ |
@ -0,0 +1,2 @@ |
|||
from . import models |
|||
from . import controllers |
@ -0,0 +1,44 @@ |
|||
# -*- coding: utf-8 -*- |
|||
############################################################################# |
|||
# |
|||
# Cybrosys Technologies Pvt. Ltd. |
|||
# |
|||
# Copyright (C) 2022-TODAY Cybrosys Technologies(<https://www.cybrosys.com>) |
|||
# Author: Cybrosys Techno Solutions(<https://www.cybrosys.com>) |
|||
# |
|||
# You can modify it under the terms of the GNU LESSER |
|||
# GENERAL PUBLIC LICENSE (LGPL v3), Version 3. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details. |
|||
# |
|||
# You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE |
|||
# (LGPL v3) along with this program. |
|||
# If not, see <http://www.gnu.org/licenses/>. |
|||
# |
|||
############################################################################# |
|||
{ |
|||
'name': 'Instagram Feed Snippet', |
|||
'version': '14.0.1.0.0', |
|||
'summary': 'Instagram Feed Snippet', |
|||
'description': """Instagram Feed Snippet""", |
|||
'category': 'Website', |
|||
'author': "Cybrosys Techno Solutions", |
|||
'website': "https://www.cybrosys.com", |
|||
'company': 'Cybrosys Techno Solutions', |
|||
'maintainer': 'Cybrosys Techno Solutions', |
|||
'license': 'LGPL-3', |
|||
'depends': ['base', 'product', 'website', 'website_sale', 'sale'], |
|||
'data': ['security/ir.model.access.csv', |
|||
'views/insta_post.xml', |
|||
'views/insta_profile.xml', |
|||
'views/snippet_structure_inherit.xml', |
|||
'views/website.xml' |
|||
], |
|||
'installable': True, |
|||
'application': True, |
|||
'auto_install': False, |
|||
|
|||
} |
@ -0,0 +1 @@ |
|||
from . import main |
@ -0,0 +1,30 @@ |
|||
from odoo import http |
|||
from odoo.http import request |
|||
import time |
|||
|
|||
|
|||
class DashbaordCarousel(http.Controller): |
|||
@http.route('/get_dashbaord_carousel', auth="public", type='json') |
|||
def get_dashbaord_carousel(self): |
|||
events_per_slide = 3 |
|||
records = request.env['insta.post'].sudo().search( |
|||
[]) |
|||
records_grouped = [] |
|||
record_list = [] |
|||
for index, record in enumerate(records, 1): |
|||
record_list.append(record) |
|||
if index % events_per_slide == 0: |
|||
records_grouped.append(record_list) |
|||
record_list = [] |
|||
if any(record_list): |
|||
records_grouped.append(record_list) |
|||
values = { |
|||
"objects": records_grouped, |
|||
"events_per_slide": events_per_slide, |
|||
"num_slides": len(records_grouped), |
|||
"uniqueId": "pc-%d" % int(time.time() * 1000), |
|||
} |
|||
print(len(records_grouped)) |
|||
response = http.Response( |
|||
template='insta_feed_snippet.s_carousel_template_items', qcontext=values) |
|||
return response.render() |
@ -0,0 +1,7 @@ |
|||
## Module <insta_feed_snippet> |
|||
|
|||
#### 09.11.2022 |
|||
#### Version 14.0.1.0.0 |
|||
#### ADD |
|||
Initial Commit |
|||
|
@ -0,0 +1,2 @@ |
|||
from . import insta_profile |
|||
from . import insta_post |
@ -0,0 +1,27 @@ |
|||
from odoo import models, fields, api, _ |
|||
import requests |
|||
|
|||
from odoo.exceptions import UserError |
|||
|
|||
|
|||
class InstaPost(models.Model): |
|||
_name = 'insta.post' |
|||
|
|||
name = fields.Char(string="Media ID") |
|||
caption = fields.Char("Caption") |
|||
post_image = fields.Binary(string='Post Image', attachment=True) |
|||
profile_id = fields.Many2one('insta.profile') |
|||
|
|||
def action_update_post(self, access_token): |
|||
|
|||
url = 'https://graph.facebook.com/v15.0/%s?fields=id,caption,comments_count,is_comment_enabled,like_count,media_product_type,media_type,media_url,owner,permalink,thumbnail_url,timestamp,username&access_token=%s' % ( |
|||
self.name, access_token) |
|||
media_content = requests.get(url, timeout=5).json() |
|||
if not media_content.get('error'): |
|||
if media_content.get('caption'): |
|||
self.write({ |
|||
'caption': media_content['caption'], |
|||
|
|||
}) |
|||
else: |
|||
raise UserError(_('%s', media_content['error']['message'])) |
@ -0,0 +1,81 @@ |
|||
import base64 |
|||
from odoo import models, fields, api, _ |
|||
import requests |
|||
|
|||
from odoo.exceptions import UserError |
|||
|
|||
|
|||
class InstaProfile(models.Model): |
|||
_name = 'insta.profile' |
|||
|
|||
name = fields.Char(string="Name", readonly=True) |
|||
access_token = fields.Text("Access Token") |
|||
username = fields.Char('Username', readonly=True) |
|||
account_id = fields.Char('Account ID', readonly=True) |
|||
profile_image_url = fields.Binary(attachment=True) |
|||
|
|||
def action_fetch(self): |
|||
url = 'https://graph.facebook.com/v15.0/me/accounts?access_token=%s' % self.access_token |
|||
page = requests.get(url) |
|||
page_content = page.json() |
|||
if not page_content.get('error'): |
|||
if page_content['data'][0]['id']: |
|||
url = 'https://graph.facebook.com/v14.0/%s?fields=instagram_business_account&access_token=%s' % ( |
|||
page_content['data'][0]['id'], self.access_token) |
|||
business_account = requests.get(url) |
|||
instagram_business_account = business_account.json()['instagram_business_account']['id'] |
|||
url = 'https://graph.facebook.com/v15.0/%s?fields=name,username,biography,website,followers_count,follows_count,media_count,profile_picture_url&access_token=%s' % ( |
|||
instagram_business_account, self.access_token) |
|||
val = requests.get(url) |
|||
content = val.json() |
|||
if content.get('name'): |
|||
self.name = content['name'] |
|||
if content.get('username'): |
|||
self.username = content['username'] |
|||
if content.get('id'): |
|||
self.account_id = content['id'] |
|||
if content.get('profile_picture_url'): |
|||
img = base64.b64encode(requests.get(content['profile_picture_url']).content) |
|||
self.profile_image_url = img |
|||
|
|||
else: |
|||
raise UserError(_('%s', page_content['error']['message'])) |
|||
|
|||
def action_get_post(self): |
|||
url = 'https://graph.facebook.com/v15.0/%s/media?access_token=%s' % (self.account_id, self.access_token) |
|||
content = requests.get(url, timeout=5).json() |
|||
if not content.get('error'): |
|||
post_list = [] |
|||
records = self.env['insta.post'].search([]) |
|||
for post in records: |
|||
post_list.append(post.name) |
|||
if content.get('data'): |
|||
for vals in content['data']: |
|||
if vals['id'] not in post_list: |
|||
url = 'https://graph.facebook.com/v14.0/%s?fields=id,caption,comments_count,is_comment_enabled,like_count,media_product_type,media_type,media_url,owner,permalink,thumbnail_url,timestamp,username&access_token=%s' % ( |
|||
vals['id'], self.access_token) |
|||
media_content = requests.get(url, timeout=5).json() |
|||
|
|||
if media_content.get('media_type'): |
|||
if media_content['media_type'] == 'IMAGE': |
|||
res = self.env['insta.post'].create({ |
|||
'name': media_content['id'], |
|||
'profile_id':self.id, |
|||
}) |
|||
|
|||
image_data = base64.b64encode(requests.get(media_content['media_url']).content) |
|||
res.write({ |
|||
|
|||
'post_image': image_data, |
|||
}) |
|||
if media_content.get('caption'): |
|||
res.write({ |
|||
'caption': media_content['caption'], |
|||
|
|||
}) |
|||
|
|||
else: |
|||
record = self.env['insta.post'].search([('name', '=', vals['id'])]) |
|||
record.action_update_post(self.access_token) |
|||
else: |
|||
raise UserError(_('%s', content['error']['message'])) |
|
After Width: | Height: | Size: 3.6 KiB |
After Width: | Height: | Size: 310 B |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 576 B |
After Width: | Height: | Size: 733 B |
After Width: | Height: | Size: 911 B |
After Width: | Height: | Size: 28 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 673 B |
After Width: | Height: | Size: 878 B |
After Width: | Height: | Size: 653 B |
After Width: | Height: | Size: 905 B |
After Width: | Height: | Size: 839 B |
After Width: | Height: | Size: 427 B |
After Width: | Height: | Size: 627 B |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 988 B |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 4.4 KiB |
After Width: | Height: | Size: 589 B |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 967 B |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 3.8 KiB |
After Width: | Height: | Size: 5.0 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 56 KiB |
After Width: | Height: | Size: 56 KiB |
After Width: | Height: | Size: 59 KiB |
After Width: | Height: | Size: 1.8 MiB |
After Width: | Height: | Size: 57 KiB |
After Width: | Height: | Size: 59 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 56 KiB |
After Width: | Height: | Size: 58 KiB |
After Width: | Height: | Size: 213 KiB |
After Width: | Height: | Size: 147 KiB |
After Width: | Height: | Size: 62 KiB |
After Width: | Height: | Size: 69 KiB |
After Width: | Height: | Size: 148 KiB |
After Width: | Height: | Size: 303 KiB |
After Width: | Height: | Size: 63 KiB |
After Width: | Height: | Size: 22 KiB |
@ -0,0 +1,592 @@ |
|||
<div class="container" style="padding: 1rem !important; margin-bottom: 1rem !important;"> |
|||
<div class="row"> |
|||
<div class="col-sm-12 col-md-12 col-lg-12 d-flex justify-content-between" |
|||
style="border-bottom: 1px solid #d5d5d5;"> |
|||
<div class="my-3"> |
|||
<img src="./assets/icons/logo.png" style="width: auto !important; height: 40px !important;"> |
|||
</div> |
|||
<div class="my-3 d-flex align-items-center"> |
|||
<div |
|||
style="background-color: #7C7BAD !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;"> |
|||
<i class="fa fa-check mr-1"></i>Community |
|||
</div> |
|||
<div |
|||
style="background-color: #875A7B !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;"> |
|||
<i class="fa fa-check mr-1"></i>Enterprise |
|||
</div> |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="container" style="padding: 0rem 1.5rem 4rem !important"> |
|||
<div class="row" style="height: 900px !important;"> |
|||
<div class="col-sm-12 col-md-12 col-lg-12" |
|||
style="padding: 4rem 1rem !important; background-color: #714B67 !important; height: 600px !important; border-radius: 20px !important;"> |
|||
<h1 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #FFFFFF !important; font-size: 3.5rem !important; text-align: center !important;"> |
|||
Instagram Feed snippet</h1> |
|||
<p |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 300 !important; color: #FFFFFF !important; font-size: 1.4rem !important; text-align: center !important;"> |
|||
A Module For Instagram Feed Snippet |
|||
</p> |
|||
<img src="./assets/screenshots/hero.gif" class="img-responsive" width="100%" height="auto"/> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="row"> |
|||
<div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin-bottom: 2rem !important"> |
|||
<h2 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;"> |
|||
<i class="fa fa-compass mr-2"></i>Explore this module |
|||
</h2> |
|||
<div class="row"> |
|||
<div class="col-md-6"> |
|||
<a href="#overview" style="text-decoration: none !important;"> |
|||
<div class="row" |
|||
style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;"> |
|||
<div class="col-8"> |
|||
<h3 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;"> |
|||
Overview</h3> |
|||
<p |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;"> |
|||
Learn more about this module</p> |
|||
</div> |
|||
<div class="col-4 text-right d-flex justify-content-end align-items-center"> |
|||
<i class="fa fa-chevron-right" style="color: #714B67 !important;"></i> |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-md-6"> |
|||
<a href="#features" style="text-decoration: none !important;"> |
|||
<div class="row" |
|||
style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;"> |
|||
<div class="col-8"> |
|||
<h3 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;"> |
|||
Features</h3> |
|||
<p |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;"> |
|||
View features of this module</p> |
|||
</div> |
|||
<div class="col-4 text-right d-flex justify-content-end align-items-center"> |
|||
<i class="fa fa-chevron-right" style="color: #714B67 !important;"></i> |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-md-6"> |
|||
<a href="#screenshots" style="text-decoration: none !important;"> |
|||
<div class="row" |
|||
style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;"> |
|||
<div class="col-8"> |
|||
<h3 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;"> |
|||
Screenshots</h3> |
|||
<p |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;"> |
|||
See key screenshots of this module</p> |
|||
</div> |
|||
<div class="col-4 text-right d-flex justify-content-end align-items-center"> |
|||
<i class="fa fa-chevron-right" style="color: #714B67 !important;"></i> |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
<div class="row" id="overview"> |
|||
<div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important"> |
|||
<h2 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;"> |
|||
<i class="fa fa-pie-chart mr-2"></i>Overview |
|||
</h2> |
|||
</div> |
|||
|
|||
<div class="col-mg-12 pl-3"> |
|||
<p style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important; line-height: 30px !important;"> |
|||
As we all know, Instagram is one of the most used and popular social networking sites all over the |
|||
world. With approx. 1 billion monthly active users on Instagram, it is a perfect way to reach out to |
|||
potential users |
|||
easily. Adding your Instagram profile option on your Odoo website enables you to promote your website |
|||
products |
|||
on Instagram. The Odoo Instagram Feed Snippet module provides a feature to add an Instagram feed in |
|||
Odoo.</p> |
|||
</div> |
|||
</p> |
|||
|
|||
</div> |
|||
|
|||
|
|||
<div class="row" id="features"> |
|||
<div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important"> |
|||
<h2 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;"> |
|||
<i class="fa fa-star mr-2"></i>Features |
|||
</h2> |
|||
</div> |
|||
|
|||
<div class="col-md-6 pl-3 py-3 d-flex"> |
|||
<div> |
|||
<img src="assets/icons/check.png"> |
|||
</div> |
|||
<div> |
|||
<h4 |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;"> |
|||
The Odoo Instagram Feed Snippet module provides a feature to add an Instagram feed in Odoo</h4> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-md-6 pl-3 py-3 d-flex"> |
|||
<div> |
|||
<img src="assets/icons/check.png"> |
|||
</div> |
|||
<div> |
|||
<h4 |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;"> |
|||
You can simply drag and drop Instagram snippets on any page of your website to show your Instagram |
|||
feed.</h4> |
|||
</div> |
|||
</div> |
|||
|
|||
|
|||
</div> |
|||
|
|||
<div class="row" id="screenshots"> |
|||
<div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important"> |
|||
<h2 |
|||
style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;"> |
|||
<i class="fa fa-image mr-2"></i>Screenshots |
|||
</h2> |
|||
</div> |
|||
<div class="col-lg-12 my-2"> |
|||
<h4 class="mt-2" |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;"> |
|||
Website Backend</h4> |
|||
<p |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;"> |
|||
Once the installation |
|||
is completed, visit the Odoo website app from the backend. Here, click on Configuration>>Instagram.You |
|||
can set up your instagram profile by adding access key and click fetch account button.Once the profile |
|||
is generated click the fetch post button to fetch instagram post into odoo</p> |
|||
<img src="assets/screenshots/in_1.png" class="img-responsive img-thumbnail border" width="100%" |
|||
height="auto"/> |
|||
</div> |
|||
|
|||
<div class="col-lg-12 my-3"> |
|||
<h4 class="mt-3" |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;"> |
|||
Profile</h4> |
|||
<p |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;"> |
|||
|
|||
</p> |
|||
<img src="assets/screenshots/in_2.png" class="img-responsive img-thumbnail border" width="100%" |
|||
height="auto"/> |
|||
</div> |
|||
|
|||
<div class="col-lg-12 my-3"> |
|||
<h4 class="mt-3" |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;"> |
|||
Instagram Posts</h4> |
|||
<img src="assets/screenshots/in_3.png" class="img-responsive img-thumbnail border" width="100%" |
|||
height="auto"/> |
|||
</div> |
|||
|
|||
|
|||
<div class="col-lg-12 my-3"> |
|||
<h4 class="mt-3" |
|||
style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;"> |
|||
Website Frontend</h4> |
|||
In Odoo website frontend click on the Edit option.After that, select the Instagram widget and drag it |
|||
to the place where you want to showcase it on your Odoo website frontend, and click on the Save |
|||
button.</p> |
|||
<img src="assets/screenshots/in_4.png" class="img-responsive img-thumbnail border" width="100%" |
|||
height="auto"/> |
|||
</div> |
|||
|
|||
|
|||
<div class="col-lg-12 my-3"> |
|||
<p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">After that, once you |
|||
save it, the Instagram widget will let you show your Instagram feed on your Odoo website as shown |
|||
below.</p> |
|||
<img src="assets/screenshots/in_5.png" class="img-responsive img-thumbnail border" width="100%" |
|||
height="auto"/> |
|||
</div> |
|||
|
|||
|
|||
</div> |
|||
<!-- SUGGESTED PRODUCTS --> |
|||
<div class="row"> |
|||
<div class="col-lg-12 d-flex flex-column justify-content-center" |
|||
style="text-align: center; padding: 2.5rem 1rem !important;"> |
|||
<h2 style="color: #212529 !important;">Suggested Products</h2> |
|||
<hr |
|||
style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;"/> |
|||
|
|||
<div id="demo1" class="row carousel slide" data-ride="carousel"> |
|||
<!-- The slideshow --> |
|||
<div class="carousel-inner"> |
|||
<div class="carousel-item active" style="min-height:0px"> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/export_stockinfo_xls/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" |
|||
style="border-top-left-radius:10px; border-top-right-radius:10px" |
|||
src="./assets/modules/export_image.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/custom_gantt_view/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" |
|||
style="border-top-left-radius:10px; border-top-right-radius:10px" |
|||
src="./assets/modules/gantt_image.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/sales_credit_limit/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" |
|||
style="border-top-left-radius:10px; border-top-right-radius:10px" |
|||
src="./assets/modules/credit_image.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
<div class="carousel-item" style="min-height:0px"> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/base_account_budget/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" |
|||
style="border-top-left-radius:10px; border-top-right-radius:10px" |
|||
src="./assets/modules/budget_image.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/product_to_quotation/" target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" |
|||
style="border-top-left-radius:10px; border-top-right-radius:10px" |
|||
src="./assets/modules/quotation_image.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
<div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left"> |
|||
<a href="https://apps.odoo.com/apps/modules/15.0/employee_documents_expiry/" |
|||
target="_blank"> |
|||
<div style="border-radius:10px"> |
|||
<img class="img img-responsive center-block" |
|||
style="border-top-left-radius:10px; border-top-right-radius:10px" |
|||
src="./assets/modules/employee_image.png"> |
|||
</div> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- Left and right controls --> |
|||
<a class="carousel-control-prev" href="#demo1" data-slide="prev" |
|||
style="left:-25px;width: 35px;color: #000;"> |
|||
<span class="carousel-control-prev-icon"><i class="fa fa-chevron-left" |
|||
style="font-size:24px"></i></span> </a> |
|||
<a class="carousel-control-next" href="#demo1" data-slide="next" |
|||
style="right:-25px;width: 35px;color: #000;"> |
|||
<span class="carousel-control-next-icon"><i class="fa fa-chevron-right" style="font-size:24px"></i></span> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- END OF SUGGESTED PRODUCTS --> |
|||
|
|||
<!-- OUR SERVICES --> |
|||
<section class="container" style="margin-top: 6rem !important;"> |
|||
<div class="row"> |
|||
<div class="col-lg-12 d-flex flex-column justify-content-center align-items-center"> |
|||
<h2 style="color: #212529 !important;">Our Services</h2> |
|||
<hr |
|||
style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;"/> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/cogs.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Customization</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #ff6b6b !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/wrench.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Implementation</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/lifebuoy.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Support</h6> |
|||
</div> |
|||
|
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #ffa801 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/user.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Hire |
|||
Odoo |
|||
Developer</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #54a0ff !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/puzzle.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Integration</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/update.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Migration</h6> |
|||
</div> |
|||
|
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #786fa6 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/consultation.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Consultancy</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/training.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Implementation</h6> |
|||
</div> |
|||
|
|||
<div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4"> |
|||
<div class="d-flex justify-content-center align-items-center mx-3 my-3" |
|||
style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;"> |
|||
<img src="assets/icons/license.png" class="img-responsive" height="48px" width="48px"> |
|||
</div> |
|||
<h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;"> |
|||
Odoo |
|||
Licensing Consultancy</h6> |
|||
</div> |
|||
</div> |
|||
</section> |
|||
<!-- END OF END OF OUR SERVICES --> |
|||
|
|||
<!-- OUR INDUSTRIES --> |
|||
<section class="container" style="margin-top: 6rem !important;"> |
|||
<div class="row"> |
|||
<div class="col-lg-12 d-flex flex-column justify-content-center align-items-center"> |
|||
<h2 style="color: #212529 !important;">Our Industries</h2> |
|||
<hr |
|||
style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;"/> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/trading-black.png" class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Trading |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Easily procure |
|||
and |
|||
sell your products</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/pos-black.png" class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
POS |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Easy |
|||
configuration |
|||
and convivial experience</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/education-black.png" class="img-responsive mb-3" height="48px" |
|||
width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Education |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
A platform for |
|||
educational management</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/manufacturing-black.png" class="img-responsive mb-3" height="48px" |
|||
width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Manufacturing |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Plan, track and |
|||
schedule your operations</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/ecom-black.png" class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
E-commerce & Website |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Mobile |
|||
friendly, |
|||
awe-inspiring product pages</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/service-black.png" class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Service Management |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Keep track of |
|||
services and invoice</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/restaurant-black.png" class="img-responsive mb-3" height="48px" |
|||
width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Restaurant |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
Run your bar or |
|||
restaurant methodically</p> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="col-lg-3"> |
|||
<div class="my-4 d-flex flex-column justify-content-center" |
|||
style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;"> |
|||
<img src="./assets/icons/hotel-black.png" class="img-responsive mb-3" height="48px" width="48px"> |
|||
<h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;"> |
|||
Hotel Management |
|||
</h5> |
|||
<p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;"> |
|||
An |
|||
all-inclusive |
|||
hotel management application</p> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
</section> |
|||
|
|||
<!-- END OF END OF OUR INDUSTRIES --> |
|||
|
|||
<!-- FOOTER --> |
|||
<!-- Footer Section --> |
|||
<section class="container" style="margin: 5rem auto 2rem;"> |
|||
<div class="row" style="max-width:1540px;"> |
|||
<div class="col-lg-12 d-flex flex-column justify-content-center align-items-center"> |
|||
<h2 style="color: #212529 !important;">Need Help?</h2> |
|||
<hr |
|||
style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;"/> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- Contact Cards --> |
|||
<div class="row d-flex justify-content-center align-items-center" |
|||
style="max-width:1540px; margin: 0 auto 2rem auto;"> |
|||
|
|||
<div class="col-lg-12" style="padding: 0rem 3rem 2rem; border-radius: 10px; margin-right: 3rem; "> |
|||
|
|||
<div class="row mt-4"> |
|||
<div class="col-lg-6"> |
|||
<a href="mailto:odoo@cybrosys.com" target="_blank" class="btn btn-block mb-2 deep_hover" |
|||
style="text-decoration: none; background-color: #4d4d4d; color: #FFF; border-radius: 4px;"><i |
|||
class="fa fa-envelope mr-2"></i>odoo@cybrosys.com</a> |
|||
</div> |
|||
<div class="col-lg-6"> |
|||
<a href="https://api.whatsapp.com/send?phone=918606827707" target="_blank" |
|||
class="btn btn-block mb-2 deep_hover" |
|||
style="text-decoration: none; background-color: #25D366; color: #FFF; border-radius: 4px;"><i |
|||
class="fa fa-whatsapp mr-2"></i>+91 86068 27707</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
<!-- End of Contact Cards --> |
|||
</section> |
|||
<!-- Footer --> |
|||
<section class="oe_container" style="padding: 2rem 3rem 1rem;"> |
|||
<div class="row" style="max-width:1540px; margin: 0 auto; margin-right: 3rem; "> |
|||
<!-- Logo --> |
|||
<div class="col-lg-12 d-flex justify-content-center align-items-center" style="margin-top: 3rem;"> |
|||
<img src="https://www.cybrosys.com/images/logo.png" width="200px" height="auto"/> |
|||
</div> |
|||
<!-- End of Logo --> |
|||
<div class="col-lg-12"> |
|||
<hr |
|||
style="margin-top: 3rem;background: linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(229,229,229,1) 33%, rgba(229,229,229,1) 58%, rgba(0,212,255,0) 100%); height: 2px; border-style: none;"> |
|||
<!-- End of Footer Section --> |
|||
</div> |
|||
</div> |
|||
</section> |
|||
<!-- END OF FOOTER --> |
|||
|
|||
</div> |
@ -0,0 +1,6 @@ |
|||
/** |
|||
* Owl Carousel v2.3.4 |
|||
* Copyright 2013-2018 David Deutsch |
|||
* Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE |
|||
*/ |
|||
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%} |
@ -0,0 +1,6 @@ |
|||
/** |
|||
* Owl Carousel v2.3.4 |
|||
* Copyright 2013-2018 David Deutsch |
|||
* Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE |
|||
*/ |
|||
.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791} |
After Width: | Height: | Size: 8.6 KiB |
@ -0,0 +1,23 @@ |
|||
odoo.define('insta_feed_snippet.carousel_dashboard', function(require){ |
|||
'use strict'; |
|||
var Animation = require('website.content.snippets.animation'); |
|||
var ajax = require('web.ajax'); |
|||
|
|||
Animation.registry.get_dashbaord_carousel = Animation.Class.extend({ |
|||
selector : '.s_carousel_template', |
|||
init: function() { |
|||
this._super.apply(this, arguments); |
|||
console.log("Init loaded"); |
|||
}, |
|||
start: function(){ |
|||
console.log("Test"); |
|||
var self = this; |
|||
ajax.jsonRpc('/get_dashbaord_carousel', 'call', {}) |
|||
.then(function (data) { |
|||
if(data){ |
|||
self.$target.empty().append(data); |
|||
} |
|||
}); |
|||
} |
|||
}); |
|||
}); |
@ -0,0 +1,34 @@ |
|||
<script> |
|||
$(document).ready(function () { |
|||
$(".owl-theme2").owlCarousel( |
|||
{ |
|||
items: 3, |
|||
loop: true, |
|||
margin: 40, |
|||
stagePadding: 0, |
|||
smartSpeed: 450, |
|||
autoplay: false, |
|||
autoPlaySpeed: 3000, |
|||
autoPlayTimeout: 1000, |
|||
autoplayHoverPause: true, |
|||
dots: false, |
|||
nav: false, |
|||
responsive: { |
|||
0: { |
|||
items: 1, |
|||
nav: false |
|||
}, |
|||
600: { |
|||
items: 2, |
|||
nav: false |
|||
}, |
|||
1000: { |
|||
items: 3, |
|||
nav: true, |
|||
loop: false |
|||
} |
|||
} |
|||
} |
|||
); |
|||
}); |
|||
</script> |
@ -0,0 +1,85 @@ |
|||
<?xml version="1.0" encoding="utf-8"?> |
|||
<odoo> |
|||
|
|||
|
|||
<record id="instagram_post_view_kanban" model="ir.ui.view"> |
|||
<field name="name">insta.post.kanban</field> |
|||
<field name="model">insta.post</field> |
|||
<field name="arch" type="xml"> |
|||
<kanban sample="1" create="false"> |
|||
<field name="caption"/> |
|||
<templates> |
|||
<t t-name="kanban-box"> |
|||
<div class="oe_kanban_card oe_kanban_global_click"> |
|||
<div class="o_kanban_image mr-1"> |
|||
|
|||
<field name="post_image" widget="image" class="o_image_64_contain"/> |
|||
</div> |
|||
<div class="oe_kanban_details"> |
|||
<div class="o_kanban_record_top mb-0"> |
|||
<div class="o_kanban_record_headings"> |
|||
<strong class="o_kanban_record_title"> |
|||
<field name="caption"/> |
|||
</strong> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</t> |
|||
</templates> |
|||
</kanban> |
|||
</field> |
|||
</record> |
|||
<record id="instagram_post_view_form" model="ir.ui.view"> |
|||
<field name="name">insta.post.form</field> |
|||
<field name="model">insta.post</field> |
|||
<field name="arch" type="xml"> |
|||
<form create="false" edit="false"> |
|||
<sheet clas="bg-primary"> |
|||
<div class="row o_website_sale_image_modal" style="display:flex;justify-content: center;"> |
|||
<div class="col-md-6 col-xl-5"> |
|||
<h2> |
|||
<field name="name" invisible="1"/> |
|||
<field name="profile_id" invisible="1"/> |
|||
<field name="caption" style="word-break: break-all;"/> |
|||
<field name="post_image" widget="image"/> |
|||
</h2> |
|||
</div> |
|||
</div> |
|||
</sheet> |
|||
|
|||
</form> |
|||
</field> |
|||
</record> |
|||
<record id="instagram_post_view_list" model="ir.ui.view"> |
|||
<field name="name">insta.post.tree</field> |
|||
<field name="model">insta.post</field> |
|||
<field name="arch" type="xml"> |
|||
<tree create="false" edit="false"> |
|||
<field name="name"/> |
|||
</tree> |
|||
</field> |
|||
</record> |
|||
<record id="insta_post_search" model="ir.ui.view"> |
|||
<field name="name">insta.post.search</field> |
|||
<field name="model">insta.post</field> |
|||
<field name="arch" type="xml"> |
|||
<search> |
|||
<field name="caption"/> |
|||
</search> |
|||
</field> |
|||
|
|||
</record> |
|||
<record id="action_insta_posts" model="ir.actions.act_window"> |
|||
<field name="name">Instagram Posts</field> |
|||
<field name="res_model">insta.post</field> |
|||
<field name="view_mode">kanban,tree,form</field> |
|||
</record> |
|||
<menuitem id="insta_posts" |
|||
name="INSTAGRAM" |
|||
sequence="1" |
|||
action="action_insta_posts" |
|||
parent="website.menu_website_configuration"/> |
|||
|
|||
|
|||
</odoo> |
@ -0,0 +1,119 @@ |
|||
<?xml version="1.0" encoding="utf-8"?> |
|||
<odoo> |
|||
<record id="instagram_profile_settings_form" model="ir.ui.view"> |
|||
<field name="name">insta.profile.form</field> |
|||
<field name="model">insta.profile</field> |
|||
<field name="arch" type="xml"> |
|||
<form> |
|||
<sheet> |
|||
<div class="oe_button_box" name="button_box"> |
|||
|
|||
<button name="action_fetch" string="Fetch Account" type="object" class="oe_stat_button" |
|||
icon="fa-instagram"/> |
|||
<button name="action_get_post" string="Fetch Posts" type="object" class="oe_stat_button" |
|||
attrs="{'invisible': [('username', '=', False)]}" |
|||
icon="fa-save"/> |
|||
|
|||
</div> |
|||
|
|||
<field name="profile_image_url" widget="image" class="oe_avatar"/> |
|||
<div class="oe_title mb24"> |
|||
<h1> |
|||
<field name="name" widget="text"/> |
|||
</h1> |
|||
</div> |
|||
<div class="row o_website_sale_image_modal"> |
|||
<div class="col-md-6 col-xl-5"> |
|||
<group> |
|||
<field name="access_token" password="True" style="width:600px;word-break: break-all;"/> |
|||
<field name="username"/> |
|||
<field name="account_id"/> |
|||
|
|||
</group> |
|||
</div> |
|||
</div> |
|||
</sheet> |
|||
</form> |
|||
</field> |
|||
</record> |
|||
<record id="instagram_profile_settings_list" model="ir.ui.view"> |
|||
<field name="name">insta.profile.form</field> |
|||
<field name="model">insta.profile</field> |
|||
<field name="arch" type="xml"> |
|||
<tree> |
|||
<field name="name"/> |
|||
<field name="username"/> |
|||
</tree> |
|||
</field> |
|||
</record> |
|||
<!-- <record id="instagram_profile_settings_kanban" model="ir.ui.view">--> |
|||
<!-- <field name="name">insta.profile.kanban</field>--> |
|||
<!-- <field name="model">insta.profile</field>--> |
|||
<!-- <field name="arch" type="xml">--> |
|||
<!-- <kanban class="o_kanban_mobile">--> |
|||
<!-- <field name="name"/>--> |
|||
<!-- <field name="username"/>--> |
|||
<!-- <field name="profile_image_url"/>--> |
|||
<!-- <field name="website"/>--> |
|||
<!-- <templates>--> |
|||
<!-- <t t-name="kanban-box">--> |
|||
<!-- <div t-attf-class="oe_kanban_card oe_kanban_global_click o_kanban_record_has_image_fill o_hr_kanban_record">--> |
|||
<!-- <field name="profile_image_url" widget="image" class="o_kanban_image_fill_left"--> |
|||
<!-- options="{'zoom': true, 'zoom_delay': 1000, 'background': true, 'preventClicks': false}"/>--> |
|||
<!-- <div class="oe_kanban_details ml8">--> |
|||
<!-- <div class="o_kanban_record_top">--> |
|||
<!-- <div class="o_kanban_record_top_left">--> |
|||
<!-- <div class="o_kanban_record_headings">--> |
|||
<!-- <strong class="o_kanban_record_title">--> |
|||
<!-- <div>--> |
|||
<!-- <strong>--> |
|||
<!-- <field name="username" widget="label_selection"/>--> |
|||
<!-- </strong>--> |
|||
<!-- </div>--> |
|||
<!-- </strong>--> |
|||
<!-- <span class="o_kanban_record_subtitle">--> |
|||
<!-- <strong>--> |
|||
<!-- <field name="name"/>--> |
|||
<!-- <br/>--> |
|||
<!-- <field name="website" widget="url"/>--> |
|||
<!-- </strong>--> |
|||
<!-- </span>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- <div class="o_kanban_record_bottom mt-3">--> |
|||
<!-- <div class="oe_kanban_bottom_left">--> |
|||
<!-- <div class="o_project_kanban_boxes">--> |
|||
<!-- <div>--> |
|||
<!-- <strong>--> |
|||
<!-- <span class="o_value">Followers</span>--> |
|||
<!-- <span class="o_label">--> |
|||
<!-- <field name="followers_count"/>--> |
|||
<!-- </span>--> |
|||
<!-- </strong>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- <div class="oe_kanban_bottom_right">--> |
|||
<!-- <div class="o_project_kanban_boxes">--> |
|||
<!-- <div>--> |
|||
<!-- <strong>--> |
|||
<!-- <span class="o_value">Follows</span>--> |
|||
<!-- <span class="o_label">--> |
|||
<!-- <field name="follows_count"/>--> |
|||
<!-- </span>--> |
|||
<!-- </strong>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
|
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </t>--> |
|||
<!-- </templates>--> |
|||
<!-- </kanban>--> |
|||
<!--</field>--> |
|||
<!-- </record>--> |
|||
|
|||
</odoo> |
@ -0,0 +1,86 @@ |
|||
<?xml version="1.0" encoding="UTF-8" ?> |
|||
<odoo> |
|||
<template id="carousal_dashboard" inherit_id="website.snippets" |
|||
name="Caroudal Dashboard"> |
|||
<xpath expr="//div[@id='snippet_effect']/div[hasclass('o_panel_body')]" |
|||
position="inside"> |
|||
<t t-snippet="insta_feed_snippet.s_carousel_template" |
|||
t-thumbnail="/insta_feed_snippet/static/src/image/carousel.png"/> |
|||
</xpath> |
|||
</template> |
|||
|
|||
<template id="s_carousel_template" name="Insta Feed"> |
|||
<section class="s_carousel_template pt24 pb24"> |
|||
<div class="container"> |
|||
|
|||
</div> |
|||
</section> |
|||
</template> |
|||
<template id="s_carousel_inner_items" name="Header Image Footer Card"> |
|||
<div class="container"> |
|||
<h3 class="text-center mb32">Follow Us On Instagram</h3> |
|||
|
|||
<div class="row" |
|||
style="float: left; padding: 10px; height: 400px; width:100%;"> |
|||
<t t-foreach="latest_products" t-as="product"> |
|||
<div t-attf-class="d-flex col-12 col-sm-6 col-md-#{int(12 / events_per_slide)}"> |
|||
<ul> |
|||
<a t-attf-href="https://www.instagram.com/{{product.profile_id.username}}/"> |
|||
<div class="wrapper"> |
|||
<div class="img_wrapper"> |
|||
<div class="row align-items-start"> |
|||
<div class="col" |
|||
style="height: 150px;"> |
|||
<img class="img-fluid" |
|||
loading="lazy" |
|||
style="height: 304px; width:255px;max-width:none;" |
|||
t-attf-src="data:image/jpg;base64,{{ product.post_image }}"/> |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</ul> |
|||
</div> |
|||
</t> |
|||
</div> |
|||
</div> |
|||
|
|||
</template> |
|||
|
|||
<template id="s_carousel_template_items"> |
|||
<div class="container"> |
|||
<div class="products_carousel_slider oe_website_events"> |
|||
<input type="hidden" name="products_count" t-if="objects" |
|||
t-att-value="len(objects)"/> |
|||
<div t-att-id="uniqueId" class="carousel slide d-flex" |
|||
data-ride="carousel"> |
|||
<a class="o_courses_carousel_control carousel-control-prev position-relative" |
|||
t-att-href="'#' + uniqueId" |
|||
role="button" data-slide="prev" |
|||
t-if="num_slides > 1"> |
|||
<i class="fa fa-2x fa-chevron-left text-black-50"/> |
|||
<span class="sr-only">Previous</span> |
|||
</a> |
|||
<div class="carousel-inner"> |
|||
<t t-foreach="objects" t-as="latest_products"> |
|||
<div t-attf-class="carousel-item #{'' if latest_products_index else 'active'}"> |
|||
<div> |
|||
<t t-call="insta_feed_snippet.s_carousel_inner_items"/> |
|||
</div> |
|||
</div> |
|||
</t> |
|||
</div> |
|||
<a class="o_courses_carousel_control carousel-control-next position-relative" |
|||
t-att-href="'#' + uniqueId" |
|||
role="button" data-slide="next" |
|||
t-if="num_slides > 1"> |
|||
<i class="fa fa-2x fa-chevron-right text-black-50"/> |
|||
<span class="sr-only">Next</span> |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
</odoo> |
@ -0,0 +1,22 @@ |
|||
<?xml version="1.0" encoding="utf-8"?> |
|||
<odoo> |
|||
|
|||
<record id="action_website_insta_profile" model="ir.actions.act_window"> |
|||
<field name="name">Insta profile</field> |
|||
<field name="type">ir.actions.act_window</field> |
|||
<field name="view_mode">kanban,tree,form</field> |
|||
<field name="res_model">insta.profile</field> |
|||
</record> |
|||
<menuitem |
|||
id="web_insta_details" |
|||
name="Instagram" |
|||
sequence="30" |
|||
action="action_website_insta_profile" |
|||
parent="website.menu_website_global_configuration" |
|||
/> |
|||
<template id="assets_frontend" inherit_id="web.assets_frontend" name="Instagram: Frontend Assets"> |
|||
<xpath expr="script[last()]" position="after"> |
|||
<script type="text/javascript" src="/insta_feed_snippet/static/src/js/caroursel.js"/> |
|||
</xpath> |
|||
</template> |
|||
</odoo> |