BACK
|Case Study

Ahimsa.id

Ahimsa.id Web Development Logo

Ahimsa Indonesia is an independent institution that focuses on the social-humanities development of Indonesian society in an inclusive and sustainable manner. Our work focuses on five main areas: Socio-Economic, Politics and Democracy, Education, Culture and Religion, Environment. We are also helping and collaborating with NGO all over the World.

Founded in mid-2019 with offices in South Jakarta, Ahimsa Indonesia is active in conducting studies and activities that encourage the advancement of civilization.

Activity

  • Conduct research on various issues related to social-humanities and the environment in order to advance the lives of Indonesian people.
  • Conduct action-based and sustainable actions to advance the lives of Indonesian people
  • Support inclusive public and private policy discourse on Indonesia’s community development strategies that are sustainable and environmentally sound
  • Strengthening the role of civil society in advancing and promoting human values ​​in the civilization of Indonesian society

Task

Build a minimalistic site for a non-profit organization.

Requested Features:

  • Slider
  • Translation
  • Blogging with CMS
  • Campaign list + Donate Button
  • Integration with Paydollar
  • 10 custom e-mails & e-mail forwarders

Reference: wri-indonesia.org

Challenge

  • Integration with paydollar requires their API and admin id, so we have to wait for them to register the local bank accounts as well as paydollar account.

Solution

Functions

  • Wordpress pretty much covers the job. Plugins that we use for this project: smart slider, woocommerce, polylang, autoptimize and ultimate social media icons.
  • cPanel allows us to create unlimited custom emails, forwarders and subdomains. All we need was to change the nameservers from the domain registrar to the hosting server.
  • Paydollar already has their own woocommerce plugin and manual guide for integration at paydollar.com. All we need to do is to install the woocommerce extension plugins and integrate the site via API by following the instruction pdf.
  • For safety reason, we don't ask the admin id nor API, instead we ask paydollar for a test account and give the login instruction ahimsa's manager for the real account.

Design

  • We custom the CSS of smart slider with @media (max-width:600px) so the white box over the slider appears above the slider on mobile {position: relative;}, but on top of the slider on dekstop {position: absolute;}.
  • We modified woocommerce add-to-cart and checkout features with nameyourprice and swatches so the users can write the donation or select the option by themselves.
  • We created dual collapsible navbar on mobile: one beside the logo is for donate and switching the languages, and one below the logo is for page navigation.

Result

https://ahimsa.id

Philoshop Web Development for ahimsa.id Donation-Dekstop View Philoshop Web Design for ahimsa.id Dekstop View
Philoshop Web Design for ahimsa.id Mobile View

Overall

  • Service: Website Development
  • Category: Blog, Company Profile, Non-Profit
  • Difficulty: Easy
  • Stack: PHP, jQuerry
  • Tools: WordPress, cPanel
  • Development process: 7 days
  • HR required: 1 WP Developer

Author

Alifia Zahra

Cat & Dog enthusiast; Currently works as COO of PT. Philoshop Digital Partner.

© 2020 - PT. PHILOSHOP DIGITAL PARTNER.