Specifically, the crop aspect ratios are not overriding the default image crop aspect ratios.
My cq:editConfig
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root
xmlns:sling="http://sling.apache.org/jcr/sling/1.0"
xmlns:cq="http://www.day.com/jcr/cq/1.0"
xmlns:jcr="http://www.jcp.org/jcr/1.0"
xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
jcr:primaryType="cq:EditConfig">
<cq:listeners
jcr:primaryType="cq:EditListenersConfig"
aftercreate="REFRESH_PAGE"/>
<cq:dropTargets jcr:primaryType="nt:unstructured">
<image
jcr:primaryType="cq:DropTargetConfig"
accept="[image/.*]"
groups="[media]"
propertyName="./fileReference">
<parameters
jcr:primaryType="nt:unstructured"
sling:resourceType="uc-base/components/content/general/image-cta"
imageCrop=""
imageMap=""
imageRotate=""/>
</image>
</cq:dropTargets>
<cq:inplaceEditing
jcr:primaryType="cq:InplaceEditingConfig"
active="{Boolean}true"
configPath="inplaceEditingConfig"
editorType="hybrid">
<cq:childEditors jcr:primaryType="nt:unstructured">
<text
jcr:primaryType="cq:ChildEditorConfig"
title="Text"
type="text"/>
<image
jcr:primaryType="cq:ChildEditorConfig"
title="Image"
type="image"/>
</cq:childEditors>
<inplaceEditingConfig jcr:primaryType="nt:unstructured">
<text jcr:primaryType="cq:Widget">
<rtePlugins jcr:primaryType="nt:unstructured">
<spellcheck
jcr:primaryType="nt:unstructured"
features="checktext"/>
<links jcr:primaryType="nt:unstructured">
<linkDialogConfig
jcr:primaryType="nt:unstructured"
height="{Long}316">
<linkAttributes jcr:primaryType="cq:WidgetCollection">
<linkAdvanced
jcr:primaryType="cq:Widget"
collapsed="{Boolean}true"
collapsible="{Boolean}true"
inputValue="advanced"
name="./linkdialog/cq:adhocLinkTrackingTab"
title="Link tracking"
xtype="dialogfieldset">
<items jcr:primaryType="cq:WidgetCollection">
<enable
jcr:primaryType="nt:unstructured"
attribute="enabletracking"
fieldDescription="override analytics framework settings"
fieldLabel="Custom link tracking"
name="./linkdialog/cq:adhocLinkTrackingEnableTracking"
xtype="checkbox">
<listeners
jcr:primaryType="nt:unstructured"
check="function(component){var dlg=component.findParentByType('rtelinkdialog');dlg.enableSCFields(component.checked);}"/>
</enable>
<events
jcr:primaryType="nt:unstructured"
attribute="adhocevents"
fieldDescription="e.g.: event2, event7"
fieldLabel="Include SiteCatalyst events"
name="./linkdialog/cq:adhocLinkTrackingEvents"
xtype="textfield"/>
<evars
jcr:primaryType="nt:unstructured"
attribute="adhocevars"
fieldDescription="e.g.: eVar1: pagedata.url, prop4: 'const'"
fieldLabel="Include SiteCatalyst variables"
name="./linkdialog/cq:adhocLinkTrackingEvars"
xtype="textfield"/>
</items>
</linkAdvanced>
</linkAttributes>
</linkDialogConfig>
</links>
<misctools
jcr:primaryType="nt:unstructured"
features="sourceedit"/>
<tracklinks
jcr:primaryType="nt:unstructured"
features="*"/>
</rtePlugins>
<uiSettings jcr:primaryType="nt:unstructured">
<cui jcr:primaryType="nt:unstructured">
<inline
jcr:primaryType="nt:unstructured"
toolbar="[#format,#justify,#lists,links#modifylink,links#unlink,tracklinks#modifylinktracking,-,fullscreen#start,-,spellcheck#checktext,-,control#close,control#save]">
<popovers jcr:primaryType="nt:unstructured">
<format
jcr:primaryType="nt:unstructured"
items="[format#bold,format#italic,format#underline,subsuperscript#subscript,subsuperscript#superscript]"
ref="format"/>
<justify
jcr:primaryType="nt:unstructured"
items="[justify#justifyleft,justify#justifycenter,justify#justifyright]"
ref="justify"/>
<lists
jcr:primaryType="nt:unstructured"
items="[lists#unordered,lists#ordered,lists#outdent,lists#indent]"
ref="lists"/>
<styles
jcr:primaryType="nt:unstructured"
items="styles:getStyles:styles-pulldown"
ref="styles"/>
<paraformat
jcr:primaryType="nt:unstructured"
items="paraformat:getFormats:paraformat-pulldown"
ref="paraformat"/>
</popovers>
</inline>
<fullscreen
jcr:primaryType="nt:unstructured"
toolbar="[format#bold,format#italic,format#underline,subsuperscript#subscript,subsuperscript#superscript,-,links#modifylink,links#unlink,links#anchor,tracklinks#modify,-,justify#justifyleft,justify#justifycenter,justify#justifyright,-,lists#unordered,lists#ordered,lists#outdent,lists#indent,-,table#createoredit,-,spellcheck#checktext,-,misctools#sourceedit,-,fullscreen#finish]">
<popovers jcr:primaryType="nt:unstructured">
<styles
jcr:primaryType="nt:unstructured"
items="styles:getStyles:styles-pulldown"
ref="styles"/>
<paraformat
jcr:primaryType="nt:unstructured"
items="paraformat:getFormats:paraformat-pulldown"
ref="paraformat"/>
</popovers>
</fullscreen>
<tableEditOptions
jcr:primaryType="nt:unstructured"
toolbar="[table#insertcolumn-before,table#insertcolumn-after,table#removecolumn,-,table#insertrow-before,table#insertrow-after,table#removerow,-, table#mergecells-right,table#mergecells-down,table#mergecells,table#splitcell-horizontal,table#splitcell-vertical,-,table#selectrow, table#selectcolumn,-,table#ensureparagraph,-,table#modifytableandcell,table#removetable,-,undo#undo,undo#redo,-,table#exitTableEditing]"/>
</cui>
</uiSettings>
</text>
<image jcr:primaryType="nt:unstructured">
<plugins jcr:primaryType="nt:unstructured">
<crop jcr:primaryType="nt:unstructured"
supportedMimeTypes="[image/gif,image/jpeg,image/png,image/webp,image/tiff]"
features="*">
<aspectRatios jcr:primaryType="nt:unstructured">
<landscape
jcr:primaryType="nt:unstructured"
name="Landscape"
ratio="0.8284"/>
<square
jcr:primaryType="nt:unstructured"
name="Square"
ratio="1"/>
<portrait
jcr:primaryType="nt:unstructured"
name="Portrait"
ratio="1.6180"/>
</aspectRatios>
</crop>
</plugins>
<ui jcr:primaryType="nt:unstructured">
<inline
jcr:primaryType="nt:unstructured"
toolbar="[rotate#right,history#undo,history#redo,fullscreen#fullscreen,control#close,control#finish]"/>
<fullscreen jcr:primaryType="nt:unstructured">
<toolbar
jcr:primaryType="nt:unstructured"
left="[crop#launchwithratio,rotate#right,flip#horizontal,flip#vertical,zoom#reset100,zoom#popupslider]"
right="[history#undo,history#redo,fullscreen#fullscreenexit]"/>
<replacementToolbars jcr:primaryType="nt:unstructured">
<crop
jcr:primaryType="nt:unstructured"
left="[crop#identifier]"
right="[crop#unlaunch,crop#confirm]"/>
</replacementToolbars>
</fullscreen>
</ui>
</image>
</inplaceEditingConfig>
</cq:inplaceEditing>
</jcr:root>
My component .html:
<sly data-sly-use.clientlib="/libs/granite/sightly/templates/clientlib.html" />
<sly data-sly-call="${clientlib.all @ categories='uc.base.component'}" />
<sly data-sly-use.image="${'com.adobe.cq.wcm.core.components.models.Image'}"/>
<sly data-sly-use.fix="${'/apps/uc-base/components/content/general/image/imgfix.js'@ src=properties.fileReference}" />
<div data-sly-test="${!properties.isDecorative && !properties.imageAlt && wcmmode.edit}" class="alert alert-danger">
<p>Further action is required to make this image accessible: Add image alt tag OR Mark image as decorative. The image will not display on the live site until the issue above is resolved.</p>
</div>
<div class="component image-cta cq-dd-image bg-${properties.backgroundColor || 'gray' @CONTEXT='styleToken'}">
<div class="row">
<div class="image col-xs-12 col-sm-6 col-md-5">
<img
data-sly-test="${properties.imageAlt || properties.isDecorative}" class="img-responsive"
data-sly-attribute.src="${fix.src}"
data-sly-attribute.alt="${'{0}' @ format=[properties.imageAlt != null ? properties.imageAlt : (properties.isDecorative ? null : 'no-alt')]}"
data-sly-attribute.role="${'{0}' @ format=[properties.isDecorative ? 'presentation': '']}"/>
</div>
<div class="content col-xs-12 col-sm-6 col-md-7">
<h2 data-sly-element="${properties.level}">${properties.title}</h2>
<div data-sly-resource="${'.' @ resourceType='uc-base/components/content/general/text', wcmmode='disabled'}"></div>
<div data-sly-use.sections="${'Repeater' @ childname='sections'}" class="component button width-inline">
<p data-sly-test="${!sections.hasItems && wcmmode.edit}"><strong>No buttons to display.</strong></p>
<sly data-sly-test="${sections.hasItems}" data-sly-list.section="${sections.items}">
<a data-sly-test="${section.buttonText != '' && section.buttonPath != ''}" href="${section.buttonPath}" class="btn-red">${section.buttonText}</a>
</sly>
</div>
</div>
</div>
</div>
