diff --git a/src/app/components/user/AdminPage.php b/src/app/components/user/AdminPage.php
index 9fc94e3db838305029af54cb29e58c1da7f4d073..47617c47fa2a334ca7424a58d0677076e158187c 100644
--- a/src/app/components/user/AdminPage.php
+++ b/src/app/components/user/AdminPage.php
@@ -14,23 +14,19 @@
         <?php include(__DIR__."/../template/navbar.php")?>
         <div class="blue-container">
             <?php
-                if (empty($this->data)) {
-                    echo '<tabel class="user-tabel">
-                            <tr>
-                                <th>User Id</th>
-                                <th>Username</th>
-                                <th>Email</th>
-                                <th>Nama</th>
-                            </tr>';
-                    foreach ($this->data as $song) {
-                        echo '<tr>
-                                <td>'.$song->user_id.'</td>
-                                <td>'.$song->username.'</td>
-                                <td>'.$song->email.'</td>
-                                <td>'.$song->fullname.'</td>
-                            </tr>';
+                if (!empty($this->data)) {
+                    foreach ($this->data as $user) {
+                        echo '<li>
+                                <strong>User Id:</strong> '.$user->user_id.'<br>
+                                <strong>Username:</strong> '.$user->username.'<br>
+                                <strong>Email:</strong> '.$user->email.'<br>
+                                <strong>Nama:</strong> '.$user->fullname.'<br>
+                                <button class="publisher-button" data-user_id="'.$user->user_id.'" data-username="'.$user->username.'"">Make Publisher</button>
+                              </li>
+                              ';
+
                     }
-                    echo    '</tabel>';
+                    echo '</ul>';
                 }
                 else {
                     echo '<h1 class="data-empty">Tidak ada data data</h1>';
@@ -38,5 +34,6 @@
             ?>
         </div>
     </div>
+    <script type="text/javascript" src="../../../public/Controller/adminController.js"></script>
 </body>
 </html>
diff --git a/src/app/controllers/AdminController.php b/src/app/controllers/AdminController.php
index f6b095e9a258a3d116c74aeab6a7485bd5f8ac40..42e07d24a6d314ceb8b256d94d6013218fbcafbc 100644
--- a/src/app/controllers/AdminController.php
+++ b/src/app/controllers/AdminController.php
@@ -10,7 +10,7 @@ class AdminController extends Controller implements ControllerInterface
 
                     $admin_model = $this->model('AdminModel');
                     $data = $admin_model->getAllUsers();
-                    var_dump($data);
+                    // var_dump($data);
                     $homeView=$this->view('user','AdminView', $data);
                     $homeView->render();
                     break;
diff --git a/src/public/Controller/adminController.js b/src/public/Controller/adminController.js
new file mode 100644
index 0000000000000000000000000000000000000000..f9f718e67362d7bd346c6f331af1a494770cd1b2
--- /dev/null
+++ b/src/public/Controller/adminController.js
@@ -0,0 +1,35 @@
+
+const buttons = document.querySelectorAll('.publisher-button');
+buttons.forEach(function(button){
+    button.addEventListener('click', function(){
+        let userID = button.getAttribute('data-user_id');
+        let username = button.getAttribute('data-username');
+        console.log(userID);
+        console.log(username)
+        let envelope = `
+        <Envelope xmlns="http://schemas.xmlsoap.org/soap/envelope/">
+        <Body>
+            <publish xmlns="http://interfaces.magictune.com/">
+                <publisherId xmlns="">${userID}</publisherId>
+                <username xmlns="">${username}</username>
+            </publish>
+        </Body>
+        </Envelope>
+        `;
+        fetch('http://localhost:8001/api/publisher', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'text/xml;charset=UTF-8',
+                'soapAction': ""
+            },
+            body: envelope,
+        })
+        .then(response => response.text())
+        .then(data => {
+            console.log('SOAP response:', data);
+        })
+        .catch(error => {
+            console.error('Error:', error);
+        });
+    })
+})
\ No newline at end of file
diff --git a/src/public/Resources/Styles/userPage.css b/src/public/Resources/Styles/userPage.css
index 3b3f1dc614f9f76238ccc62bac27f479bc4d03d0..3b59b9e651fb65cfcc2926037c51f3b853edf8b9 100644
--- a/src/public/Resources/Styles/userPage.css
+++ b/src/public/Resources/Styles/userPage.css
@@ -36,13 +36,14 @@ h2 {
     width: 100%;
     display: flex;
     justify-content: flex-start;
-    flex-direction: row;
+    flex-direction: column;
 
     padding: 30px 20px;
     background-color: var(--blueFont);
     border-radius: 40px;
     box-shadow: 0 0 29px 0 rgba(0, 0, 0, 0.25);
-    
+    color: white;
+
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;