Skip to main content

04 - Belajar ganti logo openproject

HiBerawal there,dari keinginan mengubah logo OpenProject menjadi logo custom, yang ada malah server blank selama 6 jam. Ingat Sandi, sebelum lakukan major changing lakukan snapshot untuk memudahkan rollback ketika ada error.  Pusing juga ya 6 jam bergelut dengan aplikasi OpenProject yang tidak bisa diakses, sementara sedang akan digunakan besok. Hampir mual dan gak doyan makan.

I’mLalu lookingapa forsebenarnya amasalahnya, wayternyata tokarena changeperbedaan mydependencies OpenProjectantara logoNode.js atdan theNPM, leftjadi topsetelah todiganti alogonya, customharus logo.
Idi triedprecompile, tosementara replaceNPM logo_openproject_white_big.pngsudah inauto app/assets/imagesupdate withjadi mytidak logokompatibel andlagi restartdengan apache.
TheNode.js. logoPas isprecompile stillerror, thesementara same.output dari precompile ini adalah themes yang akan ditampilkan sebagai frontend. Akibatnya halaman menjadi putih bersih, tapi begitu di inspect dengan CTRL+Shift+i terindikasi semuanya missing. Ok, apa yang saya lakukan:

IsLangkah therepertama a| way?Downgrade versi NPM dan NODE.JS dengan perintah berikut, (Jodoh Node.JS versi 10.19.0 adalah NPM 6.14.14)

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

ThanksLangkah &kedua regs| Install nvm, nvm adalah node version manager, tools mudah untuk mengelolan versi node.js yang akan digunakan.

nvm install 10.19.0


Seting nvm untuk menggunanakan node.js versi 10. dengan perintah sebagai berikut:

Replies (4)

Christian Ratz RE: Chnage OpenProject logo - Added by Christian Ratz over 9 years ago

Hello Christian,

You can create your own OpenProject theme. I explained how you can create one in this thread
In the theme you can just change the icon and the rest will look like the default theme.

Best
Ratzi

Christian Ratz RE: Chnage OpenProject logo - Added by Christian Ratz over 9 years ago

btw if you change the defaut logo like you did it you have to precompile the assets again but I suggest to

nvm use a10.19.0
theme

Kemudian, otherwiseinsatll youversi haveNPM tosesuai takedengan carejodohnya aboutyaitu your changedversi files at each update of OpenProject.6.14.14

npm  install -g npm@6.14.14

Best
Ratzioke proses downgrade telah selesai, lanjut pekerjaan utama yang tertunda selama enam jam yaitu compile frontend open project.

Sérgio Basto
    RE:
  1. Laksanakan Chnageprosedur OpenProjectkompiler logodengan -perintah: Added by Sérgio Basto almost 6 years ago

I preferred edit lib/open_project/design.rb and change logo_openproject_white_big.png to my logo and copy my logo to /opt/openproject/app/assets/images/

I could adjust css pixeis etc

openproject run rake assets:precompile.

  • Laksanakan prosesur stop service, systemctl stop openproject.
  • Laksanakan proses configure, Ingat configure bukan re-configure. openproject configure.
  • Jalankan service, systemctl start openproject.
  •  

    Apa itu Node.Js dan NPM?

    Node.js: adalah platform runtime JavaScript yang dibangun di atas mesin JavaScript V8 dari Google Chrome. Node.js memungkinkan eksekusi kode JavaScript di luar browser, sehingga dapat digunakan untuk mengembangkan aplikasi server-side dan scripting di lingkungan server. Node.js menyediakan lingkungan yang efisien dan non-blocking, yang membuatnya cocok untuk menghadapi tugas berbasis I/O dan menjalankan server web, API, dan aplikasi lainnya.

    Don’tnpm panic(Node afterPackage restartManager): systemadalah needsmanajer somepaket timeuntuk toNode.js. backIni onlineadalah

    repositori
    RS
    publik

    yang RE:memungkinkan Changepengembang OpenProjectJavaScript logountuk -berbagi Addeddan bymengelola Robertpaket Symborskikode 7JavaScript monthsyang ago

    dapat

    Fordigunakan thosedalam whoproyek comemereka. fromDengan morenpm, 'traditional'Anda developmentdapat environments,dengan asmudah ofmenginstal, OpenProjectmengelola, 12.5.8,dan thismemperbarui workeddependensi foratau me.paket yang diperlukan dalam proyek Node.js Anda. npm juga menyediakan alat untuk menjalankan skrip, mengelola proyek, dan memfasilitasi kolaborasi dalam pengembangan perangkat lunak.

    AfterSecara asingkat, OpenProjectNode.js packagememberikan installationruntime ontoJavaScript adi Centossisi 7server, deployment,sementara thenpm logoadalah isalat locatedmanajemen @paket yang memungkinkan pengelolaan dependensi dan distribusi kode di ekosistem Node.js. Keduanya bekerja bersama untuk mendukung pengembangan aplikasi JavaScript yang efisien dan dapat diandalkan di berbagai platform.

    /opt/openproject/app/assets/images/logo_openproject_white_big.png

    after replacing(overwriting) this file with your own logo, check that the proper owner and group are still associated with the file (ftp/sftp clients will replace the owner:group with the user performing the file replacement). The new file should reflect openproject:openproject as the owner and group.

    chown openproject:openproject logo_openproject_white_big.png
    ls -al logo_openproject_white*
    -rw-r--r--. 1 openproject openproject 14061 Aug 14 17:16 logo_openproject_white_big.png
    

    The new logo file will need to be re-compiled into the public assets.

    stop your existing service

    systemctl stop openproject
    

    compile the new assets

    openproject configure
    

    start the service

    systemctl start openproject
    

    After the new public assets have been compiled, your compiled logo is located @

    /opt/openproject/public/assets/logo_openproject_white_big-{asset-id}.png

    ... where it will be properly served by the web server in response to client browser requests.

    This may be considered a hacking approach and will likely be rendered ineffective upon any upgrade to OpenProject itself.  However, this approach can be effective for ad-hoc proof-of-concept demonstration purposes for cringy management who has come to expect every presentation to be custom branded to their organization.

    In the spirit of proper attribution, I would like to thank everyone who suggested that I buy the Enterprise Edition for making me remember everything I had forgotten about html/css/sass/js/json/node/angular/react/ruby as well as the fact that free open source doesn't come without a cost.

    If you want things to be easy, just buy the Enterprise Edition and keep some hungry devs fed!