diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..f4f1a1b
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+ogWebconsole/.env
diff --git a/ogWebconsole/.env b/ogWebconsole/.env
index 91f616b..ec37e1d 100644
--- a/ogWebconsole/.env
+++ b/ogWebconsole/.env
@@ -1 +1 @@
-NG_APP_BASE_API_URL=http://127.0.0.1:8001  
+NG_APP_BASE_API_URL=https://localhost:8443
\ No newline at end of file
diff --git a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.html b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.html
index ed0dfd0..94c1bb5 100644
--- a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.html
+++ b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.html
@@ -15,7 +15,6 @@
 </div>
 
 <div [formGroup]="taskForm" class="filters-container">
-  <!-- Unidad Organizacional -->
   <mat-form-field appearance="fill" class="full-width">
     <mat-label>Selecciona Unidad Organizacional</mat-label>
     <mat-select formControlName="organizationalUnit" (selectionChange)="onOrganizationalUnitChange()">
@@ -27,7 +26,6 @@
     <mat-error *ngIf="taskForm.get('organizationalUnit')?.invalid">Este campo es obligatorio</mat-error>
   </mat-form-field>
 
-  <!-- Aula -->
   <mat-form-field appearance="fill" class="full-width">
     <mat-label>Selecciona aula</mat-label>
     <mat-select formControlName="selectedChild" (selectionChange)="onChildChange()">
@@ -41,21 +39,18 @@
 
 <mat-divider class="divider"></mat-divider>
 
-<!-- Selectores globales -->
 <div class="global-selectors">
   <mat-form-field appearance="fill">
     <mat-label>Global ogLive</mat-label>
     <mat-select [(value)]="globalOgLive">
-      <mat-option *ngFor="let option of ogLiveOptions" [value]="option">{{ option }}</mat-option>
+      <mat-option *ngFor="let option of ogLiveOptions" [value]="option['@id']">{{ option.name }}</mat-option>
     </mat-select>
   </mat-form-field>
 
   <button mat-flat-button color="primary" (click)="applyToAll()">Aplicar a todos</button>
 </div>
 
-<!-- Tabla de Clientes -->
 <mat-table [dataSource]="dataSource" class="mat-elevation-z8">
-  <!-- Columnas de la tabla -->
   <ng-container matColumnDef="id">
     <mat-header-cell *matHeaderCellDef> Id </mat-header-cell>
     <mat-cell *matCellDef="let element"> {{element.id}} </mat-cell>
@@ -66,13 +61,12 @@
     <mat-cell *matCellDef="let element"> {{element.name}} </mat-cell>
   </ng-container>
 
-  <!-- ogLive -->
   <ng-container matColumnDef="ogLive">
     <mat-header-cell *matHeaderCellDef> Plantilla </mat-header-cell>
     <mat-cell *matCellDef="let element">
       <mat-form-field>
         <mat-select [(value)]="element.ogLive">
-          <mat-option *ngFor="let option of ogLiveOptions" [value]="option">{{ option }}</mat-option>
+          <mat-option *ngFor="let option of ogLiveOptions" [value]="option['@id']">{{ option.name }}</mat-option>
         </mat-select>
       </mat-form-field>
     </mat-cell>
@@ -82,8 +76,13 @@
   <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
 </mat-table>
 
+<div class="save-button"
+>
+  <button mat-flat-button color="primary" (click)="saveOgLiveTemplates()">Guardar</button>
+</div>
+
 <mat-paginator [length]="length"
                [pageSize]="itemsPerPage"
                [pageSizeOptions]="pageSizeOptions"
                (page)="onPageChange($event)">
-</mat-paginator>
+</mat-paginator>
\ No newline at end of file
diff --git a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts
index 281d8a7..8ce81b1 100644
--- a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts
+++ b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/pxe-boot-files.component.ts
@@ -20,16 +20,17 @@ export class PxeBootFilesComponent implements OnInit {
 
   loadingUnits: boolean = false;
 
-  ogLiveOptions: string[] = ['Live Option 1', 'Live Option 2', 'Live Option 3'];
+  ogLiveOptions: any[] = [];
 
   globalOgLive: string | null = null;
 
-  length: number = 100;
+  length: number = 0;
   itemsPerPage: number = 10;
+  page: number = 0;
   pageSizeOptions: number[] = [5, 10, 20, 40, 100];
-  currentPage: number = 0;
 
-  // Actualizar las columnas a mostrar
+  filters: any = {};
+
   displayedColumns: string[] = ['id', 'name', 'ogLive'];
 
   constructor(
@@ -45,6 +46,7 @@ export class PxeBootFilesComponent implements OnInit {
 
   ngOnInit(): void {
     this.fetchOrganizationalUnits();
+    this.fetchPxeTemplates();
   }
 
   fetchOrganizationalUnits(): void {
@@ -62,6 +64,19 @@ export class PxeBootFilesComponent implements OnInit {
       );
   }
 
+  fetchPxeTemplates(): void {
+    this.http.get<any>(`${this.baseUrl}/pxe-templates?page=${this.page + 1}&itemsPerPage=${this.itemsPerPage}`, { params: this.filters })
+      .subscribe(
+        response => {
+          this.ogLiveOptions = response['hydra:member'];
+          this.length = response['hydra:totalItems'];
+        },
+        error => {
+          this.toastService.error('Error al cargar las plantillas');
+        }
+      );
+  }
+
   onOrganizationalUnitChange(): void {
     const selectedUnitId = this.taskForm.get('organizationalUnit')?.value;
     const selectedUnit = this.availableOrganizationalUnits.find(unit => unit['@id'] === selectedUnitId);
@@ -89,16 +104,44 @@ export class PxeBootFilesComponent implements OnInit {
     }));
   }
 
+  saveOgLiveTemplates(): void {
+    const groupedByTemplate: { [key: string]: string[] } = {};
+
+    this.dataSource.forEach(client => {
+      if (client.ogLive) {
+        if (!groupedByTemplate[client.ogLive]) {
+          groupedByTemplate[client.ogLive] = [];
+        }
+        groupedByTemplate[client.ogLive].push(client['@id']);
+      }
+    });
+
+    Object.keys(groupedByTemplate).forEach(templateId => {
+      const clients = groupedByTemplate[templateId];
+      const url = `${this.baseUrl}${templateId}/add-clients`;
+
+      const payload = {
+        clients: clients
+      };
+
+      console.log('Payload:', url);
+      this.http.post(url, payload).subscribe({
+        next: () => {
+          this.toastService.success(`Clientes guardados correctamente para la plantilla ${templateId}`);
+        },
+        error: () => {
+          this.toastService.error(`Error al guardar clientes para la plantilla ${templateId}`);
+        }
+      });
+    });
+  }
+
   onPageChange(event: PageEvent): void {
-    this.currentPage = event.pageIndex;
+    this.page = event.pageIndex;
     this.itemsPerPage = event.pageSize;
-    this.search();
+    this.fetchPxeTemplates();
   }
-
-  search(): void {
-    // Logic for searching data if it comes from a paginated API would go here
-  }
-
+  
   syncOgCore(): void {
     this.http.post(`${this.baseUrl}/sync`, {}).subscribe(
       () => {