Skip to Content
Odoo เมนู
  • ลงชื่อเข้าใช้
  • ทดลองใช้ฟรี
  • แอป
    การเงิน
    • ระบบบัญชี
    • ระบบการออกใบแจ้งหนี้
    • ระบบบัญชีรายจ่าย
    • ระบบการจัดการข้อมูลผ่านสเปรดชีต (BI)
    • เอกสาร
    • ระบบลงลายเซ็น
    การขาย
    • ลูกค้าสัมพันธ์
    • การขาย
    • POS ร้านค้า
    • POS ร้านอาหาร
    • ระบบสมัครสมาชิก
    • การเช่า
    การจัดการเว็บไซต์
    • เครื่องมือสร้างเว็บไซต์
    • ระบบการขายออนไลน์
    • บล็อก
    • ฟอรั่ม
    • ไลฟ์แชท
    • ระบบการอบรมออนไลน์
    ซัพพลายเชน
    • คลังสินค้า
    • ระบบการผลิต
    • PLM
    • ระบบการจัดซื้อ
    • การซ่อมบำรุง
    • ระบบจัดการคุณภาพ
    ทรัพยากรบุคคล
    • ข้อมูลพนักงาน
    • ระบบสรรหาบุคลากร
    • ระบบการลา
    • การประเมิน
    • ระบบการแนะนำพนักงาน
    • ระบบจัดการยานพาหนะ
    การตลาด
    • โซเชียลมาร์เก็ตติ้ง
    • การตลาดผ่านอีเมล
    • ระบบการตลาดผ่าน SMS
    • ระบบการจัดงานอีเวนต์
    • การตลาดแบบอัตโนมัติ
    • ระบบแบบสำรวจ
    การบริการ
    • โปรเจกต์
    • ระบบบันทึกเวลา
    • ระบบการจัดการบริการภาคสนาม
    • ระบบดูแลช่วยเหลือ
    • การวางแผน
    • การนัดหมาย
    ประสิทธิผล
    • ระบบแสดงความคิดเห็น
    • ระบบการอนุมัติ
    • ไอโอที
    • VoIP
    • คลังข้อมูล
    • WhatsApp
    แอปพลิเคชันของบุคคลที่สาม Odoo สตูดิโอ แพลตฟอร์มคลาวด์ของ Odoo
  • อุตสาหกรรม
    การค้าปลีก
    • ร้านขายหนังสือ
    • ร้านขายเสื้อผ้า
    • ร้านขายเฟอร์นิเจอร์
    • ร้านขายของชำ
    • ร้านขายฮาร์ดแวร์
    • ร้านขายของเล่น
    Food & Hospitality
    • บาร์และผับ
    • ร้านอาหาร
    • อาหารฟาสต์ฟู้ด
    • Guest House
    • ตัวแทนจำหน่ายเครื่องดื่ม
    • Hotel
    อสังหาริมทรัพย์
    • Real Estate Agency
    • บริษัทสถาปัตยกรรม
    • บริษัทรับเหมา
    • การจัดการอสังหาริมทรัพย์
    • การจัดสวน
    • สมาคมเจ้าของอสังหาริมทรัพย์
    ปรึกษา
    • สำนักงานบัญชี
    • Odoo พาร์ทเนอร์
    • เอเจนซี่การตลาด
    • สำนักงานกฎหมาย
    • บริการสรรหาบุคลากร
    • การตรวจสอบและการรับรอง
    ระบบการผลิต
    • Textile
    • เหล็ก
    • เฟอร์นิเจอร์
    • อาหาร
    • Brewery
    • ของขวัญขององค์กร
    สุขภาพ & ฟิตเนส
    • ชมรมกีฬา
    • ร้านขายแว่นตา
    • ฟิตเนส
    • ผู้ประกอบวิชาชีพด้านสุขภาพ
    • ร้านขายยา
    • ร้านทำผม
    Trades
    • ช่างซ่อม
    • ฮาร์ดแวร์และการสนับสนุนด้านไอที
    • ระบบพลังงานแสงอาทิตย์
    • ช่างทำรองเท้า
    • บริการทำความสะอาด
    • HVAC Services
    อื่น ๆ
    • Nonprofit Organization
    • สำนักงานสิ่งแวดล้อม
    • ร้านเช่าป้ายโฆษณา
    • การถ่ายภาพ
    • ร้านเช่าจักรยาน
    • ตัวแทนจำหน่ายซอฟต์แวร์
    Browse all Industries
  • คอมมูนิตี้
    ศึกษา
    • บทเรียน
    • เอกสารกำกับโปรแกรม
    • การรับรอง
    • การฝึกอบรม
    • บล็อก
    • พอดแคสต์
    เพิ่มศักยภาพให้กับการศึกษา
    • โปรแกรมการศึกษา
    • Scale Up! Business Game
    • เยี่ยมชม Odoo
    รับซอฟต์แวร์
    • ดาวน์โหลด
    • เปรียบเทียบรุ่น
    • เผยแพร่
    ทำงานร่วมกัน
    • Github
    • ฟอรั่ม
    • ระบบการจัดงานอีเวนต์
    • การแปล
    • ร่วมเป็นพาร์ทเนอร์
    • Services for Partners
    • ลงทะเบียนเพื่อสร้างบัญชีบริษัทของคุณ
    รับบริการ
    • ค้นหาพาร์ทเนอร์
    • ค้นหานักบัญชี
    • พบกับที่ปรึกษา
    • บริการติดตั้งระบบเพื่อใช้งาน
    • ข้อมูลอ้างอิงลูกค้า
    • การสนับสนุน
    • อัปเกรด
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    รับการสาธิต
  • ราคา
  • ช่วยเหลือ

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

  • ลูกค้าสัมพันธ์
  • e-Commerce
  • ระบบบัญชี
  • สินค้าคงคลัง
  • PoS
  • โปรเจกต์
  • MRP
All apps
คุณต้องลงทะเบียนเพื่อโต้ตอบกับคอมมูนิตี้
All Posts คน เหรียญรางวัล
แท็ก (View all)
odoo accounting v14 pos v15
เกี่ยวกับฟอรั่มนี้
คุณต้องลงทะเบียนเพื่อโต้ตอบกับคอมมูนิตี้
All Posts คน เหรียญรางวัล
แท็ก (View all)
odoo accounting v14 pos v15
เกี่ยวกับฟอรั่มนี้
ช่วยเหลือ

How to override CSS on the point of sale?

ติดตาม

รับการแจ้งเตือนเมื่อมีกิจกรรมในโพสต์นี้

คำถามนี้ถูกตั้งค่าสถานะ
v8poscssoverrideodoo
2 ตอบกลับ
16286 มุมมอง
อวตาร
Pascal Tremblay

Hello all,

 

If I change the CSS code in this file : /home/odoo/addons/point_of_sale/static/src/css/pos.css

I automatically see my changes on the POS.

 

But if I make this changes in my custom module css : /home/odoo/addons/report_lapagept/static/src/css/pos_as.css

impossible to override the original CSS. I never see the changes. Only if they are in the original pos.css.

 

I have tried 2 ways to import my pos_as.css file in my custom module :

  • I put it in my __openerp__.py            

'css': [
        'static/src/css/pos_as.css',
    ],

  • I also tried with a xml file (like usually), but I'm not sure of my declaration

        <template id="assets_pos_as" name="Assets POS - AS" inherit_id="web.assets_backend">
            <xpath expr="." position="inside">
                <link rel="stylesheet" href="/report_lapagept/static/src/css/pos_as.css"/>
            </xpath>
        </template>

 

So, what is the best way TO OVERRIDE the original CSS in the point of sale of Odoo v8?

Thanks all

0
อวตาร
ละทิ้ง
อวตาร
Pascal Tremblay
ผู้เขียน คำตอบที่ดีที่สุด

Did not find better (shorter) way until today.

In /home/odoo-test/odoo-test/addons/pos_lapagept/__openerp__.py :

{
 
    'depends' : ['point_of_sale',],
    "data" : [
                'lapagept_templates.xml',
              ],
}
 

In /home/odoo-test/odoo-test/addons/pos_lapagept/lapagept_templates.xml :

<?xml version="1.0" encoding="utf-8"?>

<openerp>
    <data>
<template id="index_as" name="POS Index - AS">&lt;!DOCTYPE html&gt;
<html>
    <head>
        <title>Odoo POS - AS</title>

        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
        <meta http-equiv="content-type" content="text/html, charset=utf-8" />

        <meta name="viewport" content=" width=1024, user-scalable=no"/>
        <meta name="apple-mobile-web-app-capable" content="yes"/>
        <meta name="mobile-web-app-capable" content="yes"/>

        <link rel="shortcut icon"    sizes="196x196" href="/point_of_sale/static/src/img/touch-icon-196.png"/>
        <link rel="shortcut icon"    sizes="128x128" href="/point_of_sale/static/src/img/touch-icon-128.png"/>
        <link rel="apple-touch-icon"                 href="/point_of_sale/static/src/img/touch-icon-iphone.png"/>
        <link rel="apple-touch-icon" sizes="76x76"   href="/point_of_sale/static/src/img/touch-icon-ipad.png"/>
        <link rel="apple-touch-icon" sizes="120x120" href="/point_of_sale/static/src/img/touch-icon-iphone-retina.png"/>
        <link rel="apple-touch-icon" sizes="152x152" href="/point_of_sale/static/src/img/touch-icon-ipad-retina.png"/>

        <link rel="shortcut icon" href="/web/static/src/img/favicon.ico" type="image/x-icon"/>
        <link rel="stylesheet" href="/point_of_sale/static/src/fonts/lato/stylesheet.css" />
        <link rel="stylesheet" href="/point_of_sale/static/src/fonts/font-awesome-4.0.3/css/font-awesome.min.css" />
        <link rel="stylesheet" href="/point_of_sale/static/src/css/pos.css" id="pos-stylesheet"/>
        <link rel="stylesheet" href="/pos_lapagept/static/src/css/pos_as.css"/>
        <link rel="stylesheet" href="/point_of_sale/static/src/css/keyboard.css" />

        <t t-call-assets="web.assets_common" t-css="false" />
        <t t-call-assets="web.assets_backend" t-css="false" />

        <script type="text/javascript" id="loading-script">
            $(function() {
            var s = new openerp.init(<t t-raw='modules' />);
                <t t-raw='init' />
            });
        </script>

    </head>
    <body>
        <div class='openerp openerp_webclient_container'>
            <table class='oe_webclient'>
                <tr>
                    <td class='oe_application' />
                </tr>
            </table>
        </div>
    </body>
</html>
</template>
<template id="index_pt" name="POS Index - PT">&lt;!DOCTYPE html&gt;
<html>
    <head>
        <title>Odoo POS - PT</title>

        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
        <meta http-equiv="content-type" content="text/html, charset=utf-8" />

        <meta name="viewport" content=" width=1024, user-scalable=no"/>
        <meta name="apple-mobile-web-app-capable" content="yes"/>
        <meta name="mobile-web-app-capable" content="yes"/>

        <link rel="shortcut icon"    sizes="196x196" href="/point_of_sale/static/src/img/touch-icon-196.png"/>
        <link rel="shortcut icon"    sizes="128x128" href="/point_of_sale/static/src/img/touch-icon-128.png"/>
        <link rel="apple-touch-icon"                 href="/point_of_sale/static/src/img/touch-icon-iphone.png"/>
        <link rel="apple-touch-icon" sizes="76x76"   href="/point_of_sale/static/src/img/touch-icon-ipad.png"/>
        <link rel="apple-touch-icon" sizes="120x120" href="/point_of_sale/static/src/img/touch-icon-iphone-retina.png"/>
        <link rel="apple-touch-icon" sizes="152x152" href="/point_of_sale/static/src/img/touch-icon-ipad-retina.png"/>

        <link rel="shortcut icon" href="/web/static/src/img/favicon.ico" type="image/x-icon"/>
        <link rel="stylesheet" href="/point_of_sale/static/src/fonts/lato/stylesheet.css" />
        <link rel="stylesheet" href="/point_of_sale/static/src/fonts/font-awesome-4.0.3/css/font-awesome.min.css" />
        <link rel="stylesheet" href="/point_of_sale/static/src/css/pos.css" id="pos-stylesheet"/>
        <link rel="stylesheet" href="/pos_lapagept/static/src/css/pos_pt.css"/>
        <link rel="stylesheet" href="/point_of_sale/static/src/css/keyboard.css" />

        <t t-call-assets="web.assets_common" t-css="false" />
        <t t-call-assets="web.assets_backend" t-css="false" />

        <script type="text/javascript" id="loading-script">
            $(function() {
            var s = new openerp.init(<t t-raw='modules' />);
                <t t-raw='init' />
            });
        </script>

    </head>
    <body>
        <div class='openerp openerp_webclient_container'>
            <table class='oe_webclient'>
                <tr>
                    <td class='oe_application' />
                </tr>
            </table>
        </div>
    </body>
</html>
</template>


    </data>
</openerp>

All the CSS in the file /home/odoo-test/odoo-test/addons/pos_lapagept/static/src/css/pos_as.css will override the CSS in the original pos.css file. It works very well.

But now, somebody here could say to me why it's written « Odoo » rather than « Odoo POS - AS » when I inspect the code. See below image. ??????

 

 

0
อวตาร
ละทิ้ง
อวตาร
Tintuk Tomin
คำตอบที่ดีที่สุด

You need to update the path of css file in three places.


1.`inherit_id="web.assets_backend"`

2.`inherit_id="web.assets_frontend"`

3.`inherit_id="point_of_sale.assets"`


In the templates which inherites the above templates.

The code is shown below.



    <template id="assets_backend" name="sub_menu assets" inherit_id="web.assets_backend">

            <xpath expr="." position="inside">

                <link rel="stylesheet" href="/pos_update/static/src/css/mypos.css"/>

            </xpath>

        </template>


        <template id="assets_frontend" name="sub_menu assets front" inherit_id="web.assets_frontend">

            <xpath expr="." position="inside">

                <link rel="stylesheet" href="/pos_update/static/src/css/mypos.css"/>

            </xpath>

        </template>


    <data>

        <template id="assets" inherit_id="point_of_sale.assets">

            <xpath expr="." position="inside">

                <link rel="stylesheet" href="/pos_update/static/src/css/mypos.css"/>

                <script type="text/javascript" src="/pos_update/static/src/js/cancel.js"></script>


            </xpath>

        </template>

    </data>



You also need to ensure that if you want to modify an existing template then the stylesheet name must not be changed. 


If you want to create a stylesheet for your template the you only need to set the path of stylesheet in only one place, ie in the main template file in which you are setting the path of js file.


    <template id="assets" inherit_id="point_of_sale.assets">

                <xpath expr="." position="inside">

                    <link rel="stylesheet" href="/pos_update/static/src/css/mypos.css"/>

                    <script type="text/javascript" src="/pos_update/static/src/js/cancel.js"></script>

    

                </xpath>

            </template>



1
อวตาร
ละทิ้ง
สนุกกับการพูดคุยนี้ใช่ไหม? เข้าร่วมเลย!

สร้างบัญชีวันนี้เพื่อเพลิดเพลินไปกับฟีเจอร์พิเศษและมีส่วนร่วมกับคอมมูนิตี้ที่ยอดเยี่ยมของเรา!

ลงชื่อ
Related Posts ตอบกลับ มุมมอง กิจกรรม
Override javascript method from web
javascript css override website odoo
อวตาร
อวตาร
1
พ.ค. 23
3407
How can i see pos OrderChangeReceipt report without printer odoo15
pos odoo
อวตาร
0
ก.ย. 24
2194
Sending kitchen orders
pos odoo
อวตาร
อวตาร
1
ส.ค. 24
10484
Why I can't see my Take Away , Delivery and Dine-in in my POS?
pos odoo
อวตาร
0
ก.ย. 23
2066
certification NF525
pos odoo
อวตาร
0
มี.ค. 23
8757
คอมมูนิตี้
  • บทเรียน
  • เอกสารกำกับโปรแกรม
  • ฟอรั่ม
โอเพนซอร์ส
  • ดาวน์โหลด
  • Github
  • Runbot
  • การแปล
บริการ
  • โฮสติ้ง odoo.sh เซิร์ฟเวอร์
  • การสนับสนุน
  • อัปเกรด
  • การพัฒนาที่กำหนดเอง
  • การศึกษา
  • ค้นหานักบัญชี
  • ค้นหาพาร์ทเนอร์
  • ร่วมเป็นพาร์ทเนอร์
เกี่ยวกับเรา
  • บริษัทของเรา
  • ทรัพย์สินในรูปของเครื่องหมายการค้า
  • ติดต่อเรา
  • งาน
  • ระบบการจัดงานอีเวนต์
  • พอดแคสต์
  • บล็อก
  • ลูกค้า
  • กฎหมาย • ความเป็นส่วนตัว
  • ความปลอดภัย
الْعَرَبيّة Català 简体中文 繁體中文 (台灣) Čeština Dansk Nederlands English Suomi Français Deutsch हिंदी Bahasa Indonesia Italiano 日本語 한국어 (KR) Lietuvių kalba Język polski Português (BR) română русский язык Slovenský jazyk slovenščina Español (América Latina) Español ภาษาไทย Türkçe українська Tiếng Việt

Odoo เป็นชุดแอปธุรกิจแบบเปิดที่ครอบคลุมทุกความต้องการของบริษัทของคุณ อาธิ CRM eCommerce ระบบบัญชี ระบบสินค้าคงคลัง ระบบการขายหน้าร้าน โปรเจกต์ และ อีกมากมาย

ความเหนือกว่าอันเป็นเอกลักษณ์ของ Odoo คือการใช้งานที่ง่ายดายและผสานการทำงานอย่างสมบูรณ์แบบในเวลาเดียวกัน

Website made with

Odoo Experience on YouTube

1. Use the live chat to ask your questions.
2. The operator answers within a few minutes.

Live support on Youtube
Watch now