Site icon Hip-Hop Website Design and Development

How can i change sort category view starting from child then parent, not alphabetically

I have created categories by city and districts.

On the archive page, it displays well.

The problem is, the views are sorted alphabetically.

As a example :

Now displaying :

I want :

can anyone give me some help how to change it?

Sorry if my English is bad.
thank you

I’ve created a snippet like this:

add_action('woocommerce_loop_add_to_cart_link','displaying_product_attributes',5);
function displaying_product_attributes () {
    global $product;
    
    
    $harga_val = $product->get_attribute('pa_harga');
    
    $kt_val = $product->get_attribute('pa_kt');
    $km_val = $product->get_attribute('pa_km');
    
    $luas_bangunan_val = $product->get_attribute('pa_luas-bangunan');
    $luas_tanah_val = $product->get_attribute('pa_luas-tanah');
    
    
        
   $terms = get_the_terms( $product->get_id(),'product_cat' );
  if( $terms ) {
    $names = array();
    foreach ( $terms as $term ) {
      $names[] = $term->name;
    
    
        
    }
   
  }
    
     
    
    echo "<p style='color:#1ebf41; text-align:left; text-indent: 3px; font-size:18px;line-height: 0.5; font-weight:bold'>".$harga_val."</p>";
    
    
    echo "<p style='color:#333; text-align:left; text-indent: 3px; font-size:14px;line-height: 0.1;'><i class='fas fa-bed'></i> &nbsp;".$kt_val."&emsp;<i class='fas fa-shower'></i> &nbsp;".$km_val."&emsp;<i class='fa fa-home'></i>&nbsp; ".$luas_bangunan_val."m<sup>2</sup>&emsp;<i class='fas fa-expand-arrows-alt'></i>&nbsp; ".$luas_tanah_val."m<sup>2</sup></p>";
    
    
    print '<p style="color:#333; text-align:left; text-indent: 3px; font-size:14px;line-height: 1;"><i class="fas fa-map-marker-alt"></i> &nbsp; '.join( ', ', $names ).'</p>'.PHP_EOL;;
}

===================================================================
hi sean michael,
thank you for replying quickly.

let me give you a little hint of what i want.

on settings archive page/store page, I only show title, image and add to cart button.
(on add to cart button I have edited)

I inserted some attributes and categories located before add to cart button.

at first glance looks good, but on information category that became is inverted. (sorted alphabetically) and it becomes non-uniform.

I hope you or others are still willing to help me,

thank you very much